There are many mainstream sharing tools now, such as JiaThis, bShare sharing, and even some large companies such as Baidu sharing, but they are still just sharing on the PC side, and their support for mobile phones is not very good.
Everyone knows that many mobile browsers now have some sharing components built-in, such as UC browser and QQ browser. 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 component.
Experts are among the people. The editor of Wulin.com will take you to see the JS library written by this brother.
1. Tool introduction nativeShare.js
A tool that can directly call native sharing through javascript, which has the following characteristics:
1. Support native Weibo, WeChat friends, WeChat Moments, QQ friends, QQ space sharing
2. Support calling browser for more sharing functions
3. Do not rely on any jquery and other plugins
Note: Currently, only mobile UC browser and QQ browser are supported
github project address: https://github.com/JefferyWang/nativeShare.js
Git@OSC project address: http://git.oschina.net/wangjunfeng/nativeShare.js
2. How to use
1.Introduce CSS files
The code copy is as follows:
<link rel="stylesheet" href="nativeShare.css"/>
2. Insert the following code where you need to add sharing:
The code copy is as follows:
<div id="nativeShare"></div>
3. Add configuration information and instantiate it
The code copy is as follows:
<script>
var config = {
url:'http://blog.wangjunfeng.com',// Shared web page link
title:'Wang Junfeng's personal blog',// Title
desc:'Wang Junfeng's personal blog',// Description
img:'http://www.wangjunfeng.com/img/face.jpg',// Picture
img_title:'Wang Junfeng's personal blog',// Image title
from:'Wang Junfeng's Blog' // Source
};
var share_obj = new nativeShare('nativeShare',config);
</script>
3. Demonstration screenshot
Figure 1: Share to Sina Weibo
Figure 2: Share to WeChat Moments
Figure 3: Share with contacts via WeChat
Figure 4: QQ shares with contacts
Figure 5: QQ sharing to space
Figure 6: Calling the browser's built-in sharing component