Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including soshm with all npm packages installed. Try it out:

var soshm = require("soshm")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

soshm v1.1.3

Social Share For Mobile

Social Share

PC版请查看

特性

  • 仅需调用soshm.js,无其他库依赖
  • 支持微信,QQ,微博的原生应用分享(借用UC浏览器或者QQ浏览器或者URL scheme进行)
  • 支持使用dataset配置
  • 支持AMD、CommonJS和浏览器全局变量(使用UMD)
  • 图标及样式打包在js里,无需额外请求

安装

通过npm进行安装

npm install -S soshm

或者把脚本引进你的页面里

<script src="soshm.min.js"></script>

使用

参数

  1. 第一个参数为字符串类型,代表选择器。支持querySelectorAll 所支持的参数类型。。
  2. 第二个参数为对象字面量,配置分享的相关内容。
<div class="soshm"></div>
<script src="dist/soshm.min.js"></script>
<script>
  soshm('#share', {
    // 分享的链接,默认使用location.href
    url: '',
    // 分享的标题,默认使用document.title
    title: '',
    // 分享的摘要,默认使用<meta name="description" content="">content的值
    digest: '',
    // 分享的图片,默认获取本页面第一个img元素的src
    pic: '',
    // 默认显示的网站为以下六个个,支持设置的网站有
    // weixin,weixintimeline,qq,qzone,yixin,weibo,tqq,renren,douban,tieba
    sites: ['weixin', 'weixintimeline', 'yixin', 'weibo', 'qq', 'qzone']
  });
</script>

使用dataset进行配置

除了函数参数配置外,也可以用[data-*]的方式进行配置。 TIP: 函数参数配置优先级高于dataset配置

<div class="datasetconfig" data-title="分享标题" data-sites="yixin,weibo,weixin,tqq,qzone"></div>
<script>
  soshm('.datasetconfig', {
    sites: ['weixin,', 'weibo', 'yixin', 'qzone']
  })
</script>

弹窗形式

soshm.popIn函数已弹窗的形式展示分享的站点,接收一个表示配置分享内容的对象字面量参数。

<button id="shareBtn"></button>
<script>
  document.getElementById('shareBtn').addEventListener('click', function() {
    soshm.popIn({
      title: '弹窗分享',
      sites: ['weixin', 'weixintimeline', 'weibo', 'yixin', 'qzone', 'tqq', 'qq']
    });
  }, false);
</script>

原生分享

在UC浏览器和QQ浏览器里支持唤起微信、QQ、微博客户端进行分享。其他浏览器里支持唤起QQ客户端的分享,微博分享使用webapi进行,而微信分享需要借用QQ浏览器进行,如果用户没有安装,则点击无反应。

在微信里点击微信分享会在右上角浮出分享操作的提示,也可以手动调用soshm.weixinSharetip() 函数,此函数仅在微信里生效。

License

MIT © calledT

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free