[代码][CSS]代码  
$.fn.share = function(opts) {
  var $body, $head;
  if ($(this).length === 0) {
    console.log("Share Button: No elements found.");
    return;
  }
  $head = $('head');
  $body = $('body');
  return $(this).each(function(i, el) {
    var $sharer, bubble, bubbles, click_link, close, config, open, parent, paths, protocol, set_opt, toggle,
      _this = this;
    $sharer = $(this);
    $sharer.addClass("sharer-" + i);
    $sharer.hide();
    if (opts == null) {
      opts = {};
    }
    config = {};
    config.url = opts.url || window.location.href;
    config.text = opts.text || $('meta[name=description]').attr('content') || '';
    config.app_id = opts.app_id;
    config.title = opts.title;
    config.image = opts.image;
    config.flyout = opts.flyout || 'top center';
    config.button_color = opts.color || '#333';
    config.button_background = opts.background || '#e1e1e1';
    config.button_icon = opts.icon || 'export';
    config.button_text = typeof opts.button_text === 'string' ? opts.button_text : 'Share';
    set_opt = function(base, ext) {
      if (opts[base]) {
        return opts[base][ext] || config[ext];
      } else {
        return config[ext];
      }
    };
    config.twitter_url = set_opt('twitter', 'url');
    config.twitter_text = set_opt('twitter', 'text');
    config.fb_url = set_opt('facebook', 'url');
    config.fb_title = set_opt('facebook', 'title');
    config.fb_caption = set_opt('facebook', 'caption');
    config.fb_text = set_opt('facebook', 'text');
    config.fb_image = set_opt('facebook', 'image');
    config.gplus_url = set_opt('gplus', 'url');
    config.selector = "." + ($sharer.attr('class').split(" ").join("."));
    config.twitter_text = encodeURIComponent(config.twitter_text);
    if (typeof config.app_id === 'integer') {
      config.app_id = config.app_id.toString();
    }
    if (!$('link[href="http://weloveiconfonts.com/api/?family=entypo"]').length) {
      $("<link />").attr({
        rel: "stylesheet",
        href: "http://weloveiconfonts.com/api/?family=entypo"
      }).appendTo($("head"));
    }
    if (!$('link[href="http://fonts.googleapis.com/css?family=Lato:900"]').length) {
      $("<link />").attr({
        rel: "stylesheet",
        href: "http://fonts.googleapis.com/css?family=Lato:900"
      }).appendTo($("head"));
    }http://www.huiyi8.com/yanjiangzhici/​
    if (!$("meta[name='sharer" + config.selector + "']").length) {
      $('head').append(getStyles(config)).append("<meta name='sharer" + config.selector + "'>");
    }演讲致辞
    $(this).html("<label class='entypo-" + config.button_icon + "'><span>" + config.button_text + "</span></label><div class='social " + config.flyout + "'><ul><li class='entypo-twitter' data-network='twitter'></li><li class='entypo-facebook' data-network='facebook'></li><li class='entypo-gplus' data-network='gplus'></li></ul></div>");
    if (!window.FB && config.app_id && ($('#fb-root').length === 0)) {
      protocol = ['http', 'https'].indexOf(window.location.href.split(':')[0]) === -1 ? 'https://' : '//';
      $body.append("<div id='fb-root'></div><script>(function(a,b,c){var d,e=a.getElementsByTagName(b)[0];a.getElementById(c)||(d=a.createElement(b),d.id=c,d.src='" + protocol + "connect.facebook.net/en_US/all.js#xfbml=1&appId=" + config.app_id + "',e.parentNode.insertBefore(d,e))})(document,'script','facebook-jssdk');</script>");
    }
    paths = {
      twitter: "http://twitter.com/intent/tweet?text=" + config.twitter_text + "&url=" + config.twitter_url,
      facebook: "https://www.facebook.com/sharer/sharer.php?u=" + config.fb_url,
      gplus: "https://plus.google.com/share?url=" + config.gplus_url
    };
    parent = $sharer.parent();
    bubbles = parent.find(".social");
    bubble = parent.find("" + config.selector + " .social");
    toggle = function(e) {
      e.stopPropagation();
      return bubble.toggleClass('active');
    };
    open = function() {
      return bubble.addClass('active');
    };
    close = function() {
      return bubble.removeClass('active');
    };
    click_link = function() {
      var link, popup;
      link = paths[$(this).data('network')];
      if (($(this).data('network') === 'facebook') && config.app_id) {
        if (!window.FB) {
          console.log("The Facebook JS SDK hasn't loaded yet.");
          return;
        }
        window.FB.ui({
          method: 'feed',
          name: config.fb_title,
          link: config.fb_url,
          picture: config.fb_image,
          caption: config.fb_caption,
          description: config.fb_text
        });
      } else {
        popup = {
          width: 500,
          height: 350
        };
        popup.top = (screen.height / 2) - (popup.height / 2);
        popup.left = (screen.width / 2) - (popup.width / 2);
        window.open(link, 'targetWindow', "toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,left=" + popup.left + ",top=" + popup.top + ",width=" + popup.width + ",height=" + popup.height);
      }
      return false;
    };
    $sharer.find('label').on('click', toggle);
    $sharer.find('li').on('click', click_link);
    $body.on('click', function() {
      return bubbles.removeClass('active');
    });
    setTimeout((function() {
      return $sharer.show();
    }), 250);
    return {
      toggle: toggle.bind(this),
      open: open.bind(this),
      close: close.bind(this),
      options: config,
      self: this
    };
  });
};
}.call(this)

CSS3分享功能的更多相关文章

  1. 9款经典华丽的CSS3分享按钮

    如果你经常活跃在一些社交网站上,那么你肯定会看到过很多形式各异的分享按钮,目前由于HTML5和CSS3的普及,很多分享按钮也都应用了CSS3样式,甚至会有很多带有动画的CSS3分享按钮.本文就向大家介 ...

  2. iOS快速集成友盟社会化分享功能(v6.1.1)

    1.  U-Share SDK集成 1.1 下载U-Share SDK 通过iOS社会化组件选择所需的社交平台后进行下载,下载链接http://dev.umeng.com/social/ios/sdk ...

  3. Android中使用ShareSDK集成分享功能

    引言      现在APP开发集成分享功能已经是非常普遍的需求了.其他集成分享技术我没有使用过,今天我就来介绍下使用ShareSDK来进行分享功能开发的一些基本步骤和注意点,帮助朋友们避免一些坑.好了 ...

  4. 微信分享ios设备没有分享图标安卓有分享图标 (分享功能没有问题)

    解决方案:去除 var sharedata = { title: $("#shareTitle").val(), desc: $("#shareContent" ...

  5. 第三方登录分享功能-ShareSDK for iOS适配问题记录

    最近app里需要添加第三方授权登陆和分享的功能,选择了ShareSDK,参考了ShareSDK文档对该SDK进行了适配,但遇到了一些问题 1.问题:分享功能点击不跳转  原因:适配iOS9添加白名单 ...

  6. Web 项目中分享到微博、QQ空间等分享功能

    Web 项目中分享到微博.QQ空间等分享功能 网上有很多的模板以及代码,但是有很多都不能分享内容,简单的测试了下: 以新浪微博为例,文本框中的内容是title属性,下面的链接是url属性,如果你的链接 ...

  7. android一键分享功能不使用任何第三方sdk

    在android中有自带的一键分享功能,不过它会把所有带分享的应用都找出来,如果我们只需要一些常见的分享应用,该如何做呢? 下面看我的效果图(横屏和竖屏自动适配): 接下来看我的调用(支持图片和文字分 ...

  8. QQ空间分享功能(二)

    http://sns.z.qq.com/tools/share/demo_html.jsp  手机QQ空间分享功能接入指引: 1.请求地址: http://sns.z.qq.com/share 2.请 ...

  9. AndroidStudio用微信官方方法接入微信分享功能

    转载请注明出处:http://www.cnblogs.com/wangoublog/p/5367950.html 现在微信的功能众所周知,用户量.影响力也是惊人,很多应用接入微信的功能已成为一种不可缺 ...

随机推荐

  1. Junit 内部解密之一: Test + TestCase + TestSuite

    转自:http://blog.sina.com.cn/s/blog_6cf812be0100wbhq.html nterface: Test 整个测试的的基础接口 Method 1: abstract ...

  2. Android Studio 使用笔记:在图形界面使用 Gradle 配置项目所需jar包

    在 Android Studio 中使用第三方 jar 包,可以直接下载后添加到项目中,也可以使用 Gradle 配置进行管理.图形界面下十分简单. 点击下图中间的图标,或者选中 Model ,按F4 ...

  3. MapReudce源码分析之Mapper

    Mapper是MapReduce编程模型中一个将输入的key/value对映射成一组中间key/value对的组件.Map是将输入记录转换成中间记录的单个任务.被转换的中间记录不需要与输入记录一样的类 ...

  4. grep -rl tttt /data/ 命令在 /data 目录下面搜寻包含tttt字符的命令

    grep --help -R, -r, --recursive equivalent to --directories=recurse -l, --files-with-matches print o ...

  5. GDB + gdbserver 远程调试mediaserver进程

    远程调试步骤 在Android设备上启动gdbserver并attach你想调试的进程,并指定监听调试命令的端口(此端口是TV上的端口) $ adb shell # ps |grep media  # ...

  6. oracle中nvl()函数

    oracle中nvl()函数  oracle的nvl函数的使用方法 通过查询获得某个字段的合计值,假设这个值位null将给出一个预设的默认值  select nvl(sum(t.dwxhl),1) f ...

  7. C语言基础知识【基本语法】

    C 基本语法1.C 的令牌(Tokens)C 程序由各种令牌组成,令牌可以是关键字.标识符.常量.字符串值,或者是一个符号.2.分号 ;在 C 程序中,分号是语句结束符.也就是说,每个语句必须以分号结 ...

  8. Linux环境下,使用PHP创建一个守护进程

    <?php $pid = pcntl_fork(); // fork if ($pid < 0) exit; else if ($pid) // parent exit; else { / ...

  9. MySQL常见问题和命令

    问题: 1.centos MySQL启动失败:关闭selinux, vi /etc/selinux/config, 设置SELINUX=disabled,重启电脑: 命令: 停止.启动mysql服务器 ...

  10. csv文件的格式

    csv, comma separated values csv是一种纯文本文件. csv文件由任意数目的记录构成,记录间以换行符分割,每条记录由字段构成,字段间以逗号作为分隔符. 如果字段中有逗号,那 ...