Native javascript allows sharing to the circle of friends supports ios, android, and iosandroid

Native javascript allows sharing to the circle of friends supports ios, android, and iosandroid

There are also many mainstream sharing tools, such as JiaThis, bShare, and even some large companies such as Baidu, but they still stay on the PC side for sharing, the support for mobile phones is not very good.

We all know that many mobile browsers now have built-in sharing components, such as UC and QQ browsers. the built-in component sharing can directly start the corresponding APP sharing, how cool it would be if a JS could call the browser's built-in sharing components.

Easy to understand, let's take a look at the JS library compiled by this brother.

I. Introduction to nativeShare. js tools

A tool that can directly call native sharing through javascript has the following features:

1. Support sharing native Weibo, friends, circle of friends, QQ friends, and QQ space
2. Support calling more sharing functions in the browser
3. Don't rely on any jquery or other plug-ins
Note: currently, only mobile UC and QQ browsers are supported.

Github address: https://github.com/JefferyWang/nativeShare.js
Git @ OSC address: http://git.oschina.net/wangjunfeng/nativeShare.js

Ii. Usage

1. Introduce the CSS file

Copy codeThe Code is as follows:
<Link rel = "stylesheet" href = "nativeShare.css"/>

2. Insert the following code where you want to add a share:

Copy codeThe Code is as follows:
<Div id = "nativeShare"> </div>

3. Add and instantiate configuration information

Copy codeThe Code is as follows:
<Script>
Var config = {
Url: 'http: // blog.wangjunfeng.com ', // share the webpage link
Title: 'wang Junfeng's blog ', // title
Desc: 'wang Junfeng's blog ', // description
Img: 'http: // www.wangjunfeng.com/img/face.jpg' ,// picture
Img_title: 'wang Junfeng's blog ', // picture title
From: 'wang Junfeng's blog '// Source
};
Var pai_obj = new nativeShare ('nativeshare ', config );
</Script>

Iii. Demonstration

Figure 1: Share on Sina Weibo

Figure 2: share with your friends

Figure 3: Share with a contact

Figure 4: Share QQ with contacts

Figure 5: QQ shared space

Figure 6: Call the browser's built-in sharing component