永兴集团(中国区)官方网站-Macau App Station

400-800-9385
网站建设资讯详细

网站分享插件之Share分享插件

发表日期：2023-04-10 10:25:26   作者来源：黎云辉   浏览：2081   标签：网站建设    
当前位置：首页 - 永兴集团官网 - 网站建设
最近发现bshare以及百度分享插件，有一大堆问题，类似于样式错乱，分享链接不生效等不兼容性问题，调整起来也相当麻烦，所以干脆换一种插件。于是被我找到了Share.js，这是一款一键转发工具，它可以一键分享到微博、QQ空间、QQ好友、微信、腾讯微博、豆瓣、Facebook、Twitter、Linkedin、Google+、点点等社交网站，调用起来也相当简单。

分享样式

引入项目:

引入JS

JS，CSS：



Html：

 
其中“social-share”这个是必须的类名，此外还有一些特殊的参数设置如下：
例如：禁用 google、twitter、facebook ，需要用到 data-disabled
 data-disabled="google,twitter,facebook">

插件2
 
设置微信二维码标题，需要用到data-wechat-qrcode-title

插件3
针对特定站点使用不同的属性（title, url, description,image...）

 
你也可以自定义图标：
使用: data-initialized="true" 标签来禁用自动生成icon功能。
 

 
 
    
 
 
    
 
 
    
 
 

 
以上a标签会自动加上分享链接（a 标签必须带 icon-NAME 属性，不然分享链接不会自动加上）。
如果你想在分享icon列表中内置一些元素，比如放一个收藏按钮在分享按钮的后面：
 

 
 
    
 
 

 
这样的结果是所有的分享按钮都创建在了收藏按钮（icon-heart）的后面了，这时候你就可以用 data-mode="prepend" 来确定分享按钮创建的方式。
 

 
 
    
 
 

 
这样一来所有的分享图标就会创建在容器的内容前面。

插件4
 
以下是下载链接：
https://github.com/overtrue/share.js/zipball/master
如没特殊注明，文章均为永兴集团原创,转载请注明来自/news/6736.html
上一篇： 前端开发之使用新的 CSS sin() 和 cos() 三角函数创建一个时钟
下一篇： 小白网站建设三部曲-第一篇建设网站的初入门
相关网站设计案例
相关资讯
常见问题
最新文章
XML 地图