-
Notifications
You must be signed in to change notification settings - Fork 809
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
4 changed files
with
114 additions
and
33 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <!--[if lte IE 6 ]> <html class="ie ie6 lte-ie7 lte-ie8" lang="zh-CN"> <![endif]--> | ||
| <!--[if IE 7 ]> <html class="ie ie7 lte-ie7 lte-ie8" lang="zh-CN"> <![endif]--> | ||
| <!--[if IE 8 ]> <html class="ie ie8 lte-ie8" lang="zh-CN"> <![endif]--> | ||
| <!--[if IE 9 ]> <html class="ie ie9" lang="zh-CN"> <![endif]--> | ||
| <!--[if (gt IE 9)|!(IE)]><!--> <html lang="zh-CN"> <!--<![endif]--> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <title>Share.js - 一键分享到微博，QQ空间，腾讯微博，人人，豆瓣</title> | ||
| <meta name="description" content="Share.js 一键分享到微博，QQ空间，腾讯微博，人人，豆瓣 by overtrue." /> | ||
| <link rel="stylesheet" href="http://overtrue.me/bootstrap-theme-slim/css/bootstrap.css" media="screen"> | ||
| <link rel="stylesheet" href="http://overtrue.me/bootstrap-theme-slim/css/ionicons.css" media="screen"> | ||
| <link rel="stylesheet" href="http://overtrue.me/bootstrap-theme-slim/css/app.css" media="screen"> | ||
| <link rel="stylesheet" href="./share.css" media="screen"> | ||
| </head> | ||
| <body> | ||
| <div class="container"> | ||
| <div class="page-header"> | ||
| <h1 id="container">Share.js 示例</h1> | ||
| </div> | ||
| <div class="jumbotron"> | ||
| <h1>大寒</h1> | ||
| <p>大寒是二十四节气之一最后一个节气。每年1月20日前后太阳到达黄经300°时为大寒。《月令七十二候集解》：“十二月中，解见前（小寒）。”《授时通考·天时》引《三礼义宗》：“大寒为中者，上形于小寒，故谓之大……寒气之逆极，故谓大寒。”这时寒潮南下频繁，是中国大部分地区一年中的最冷时期，风大，低温，地面积雪不化，呈现出冰天雪地、天寒地冻的严寒景象。这个时期，铁路、邮电、石油、海上运输等部门要特别注意及早采取预防大风降温、大雪等灾害性天气的措施。农业上要加强牲畜和越冬作物的防寒防冻。</p> | ||
| <p><a class="btn btn-primary btn-lg">更多</a></p> | ||
| </div> | ||
| <div class="shares"></div> | ||
| </div> | ||
|
|
||
| <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script> | ||
| <script src="http://overtrue.me/share.js/jquery.qrcode.min.js"></script> | ||
| <script src="./share.js"></script> | ||
|
|
||
| <script> | ||
| $(function(){ | ||
| $('.shares').share(); | ||
| }); | ||
| </script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,45 +1,79 @@ | ||
| (function($){ | ||
| $.fn.share = function ($options) { | ||
| var $image = $(document).find('img:first').attr('src'); | ||
| /** | ||
| * Share.js | ||
| * | ||
| * @author overtrue <[email protected]> | ||
| * @license MIT | ||
| * | ||
| * @example | ||
| * <pre> | ||
| * $('.share-bar').share(); | ||
| * | ||
| * // or | ||
| * | ||
| * $('.share-bar').share({ | ||
| * sites: ['qzone', 'qq', 'weibo','wechat'], | ||
| * // ... | ||
| * }); | ||
| * </pre> | ||
| */ | ||
| ;(function($){ | ||
| /** | ||
| * Initialize a share bar. | ||
| * | ||
| * @param {String|Object} $item target container. | ||
| * @param {Object} $options settings (optional). | ||
| * | ||
| * @return {Void} | ||
| */ | ||
| $.fn.share = function ($item, $options) { | ||
| var $image = $(document).find('img:first').prop('src'); | ||
|
|
||
| var $defaults = { | ||
| url: window.location.href, | ||
| site: document.title, | ||
| title: $(document.head).find('[name="site-title"]').text() || document.title, | ||
| description: $(document.head).find('[name="description"]').text(), | ||
| site: $(document.head).find('[name="site"]').attr('content') || $(document.head).find('[name="Site"]').attr('content') || document.title, | ||
| title: $(document.head).find('[name="title"]').attr('content') || $(document.head).find('[name="Title"]').attr('content') || document.title, | ||
| description: $(document.head).find('[name="description"]').attr('content') || $(document.head).find('[name="Description"]').attr('content'), | ||
| image: $image ? $image : '', | ||
| target : '_blank', | ||
| qrcodeTitle: "微信扫一扫：分享", | ||
| qrcodeWidth: 100, | ||
| sites: ['qzone', 'qq', 'weibo','wechat', 'douban'], | ||
| }; | ||
|
|
||
| var $settings = $.extend(true, $defaults, $options); | ||
|
|
||
| $settings.url = encodeURI($settings.url); | ||
| $settings.site = encodeURI($settings.site); | ||
| $settings.title = encodeURI($settings.title); | ||
| $settings.description = encodeURI($settings.description); | ||
|
|
||
| var $urls = { | ||
| qzone: "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=" + $settings.url + "&title=" + $settings.title + "&desc=" + $settings.description + "&summary=" + $settings.description + "&site=" + $settings.site + ($settings.image? $settings.image : ''), | ||
| qq: "http://share.v.t.qq.com/index.php?c=share&a=index&url=" + $settings.url + "&title=" + $settings.title + $settings.description + ($settings.image ? "&pic=" + $settings.image : ''), | ||
| qq: "http://connect.qq.com/widget/shareqq/index.html?url="+ $settings.url + "&title=" + $settings.title + "&source=" + $settings.site + "&desc=" + $settings.description, | ||
| weibo: "http://service.weibo.com/share/share.php?url=" + $settings.url + "&title=" + $settings.title + $settings.description + ($settings.image ? "&pic=" + $settings.image : ''), | ||
| wechat: 'javascript:;', | ||
| douban: "http://shuo.douban.com/!service/share?href=" + $settings.url + "&name=" + $settings.title + "&text=" + $settings.description + ( $settings.image ? "&image=" + $settings.image : '') + '&starid=0&aid=0&style=11&stime=&sig=' | ||
| }; | ||
|
|
||
| this.each(function() { | ||
| var el = $(this).addClass('sns-share-component'); | ||
| var $wechat = el.find('a.wechat'); | ||
| var $el = $(this).addClass('sns-share-component'); | ||
|
|
||
| for ($i in $settings.sites) { | ||
| var $name = $settings.sites[$i]; | ||
| var $link = $('<a href="" class="'+$name+'"><i class="icon iconfont icon-'+$name+'"></i></a>') | ||
| .attr('href', $urls[$name]) | ||
| .attr('target', $settings.target); | ||
|
|
||
| for($id in $urls){ | ||
| el.find('a.' + $id).attr('href', $urls[$id]).attr('target', $settings.target); | ||
| $el.append($link); | ||
| } | ||
|
|
||
| if (!$wechat.length) {return;}; | ||
| var $wechat = $el.find('a.wechat'); | ||
|
|
||
| if (typeof $.fn.qrcode == 'function') { | ||
|
|
||
| $wechat.append('<span class="wechat-qrcode"></span>'); | ||
| $wechat.find('.wechat-qrcode').qrcode({ width: $settings.qrcodeWidth, height: $settings.qrcodeWidth - 10, text: $settings.url}); | ||
| $wechat.find('.wechat-qrcode').css({right: - $settings.qrcodeWidth / 2, display: 'block' }); | ||
| $wechat.find('.wechat-qrcode').append($settings.qrcodeTitle); | ||
| $wechat.find('.wechat-qrcode').qrcode({ width: $settings.qrcodeWidth, height: $settings.qrcodeWidth - 10, text: $settings.url}) | ||
| .css({right: - $settings.qrcodeWidth / 2, display: 'block', position:'absolute', bottom: $wechat.height()}) | ||
| .append($settings.qrcodeTitle); | ||
| } else { | ||
| console.error('未加载 jquery.qrcode.min.js, 无法支持微信分享'); | ||
| $wechat.hide(); | ||
|
|
||