二、插入代码

把以下代码粘贴到您的网页中,可以在和的之间网页的任意位置放置,然后在代码中的script标签填写你的appkey

这样就完成了,如果你还有什么不明白,可以继续翻阅文档。也可以在这里浏览我们提供的一个简单 DEMO

默认分享内容

程序默认分享内容分别如下:

链接 :浏览器地址栏的地址

标题 :title标签的内容

内容 :meta[name=description]的内容

图片 :分享平台自行抓取的图片(实际分享的图片要看分享平台自已的逻辑处理)

关于 title meta[name=description] 两个标签,它们被放在网页的head标签里面,一般情况下大部分网页都会有,如果你的页面没有,可以自行添加。

标题

如果你不想添加这两个标签,或者需要更灵活的配置,也可以使用我们提供的 API接口 ,并且 使用API接口定义的参数优先级是最高的

微信分享请看 这里

自定义弹出效果

通过增加-mob-share-ui元素的css类改变弹出效果

默认效果 -mob-share-ui-theme -mob-share-ui-theme-scatter

上边滑出 -mob-share-ui-theme -mob-share-ui-theme-slide-top

下边滑出 -mob-share-ui-theme -mob-share-ui-theme-slide-bottom

左边滑出 -mob-share-ui-theme -mob-share-ui-theme-slide-left

右边滑出 -mob-share-ui-theme -mob-share-ui-theme-slide-right

可查看 DEMO演示

自定义图标

你可以在页面中使用css对平台图标进行修改,通过.-mob-share-平台ID( 点击查看所有平台ID )定义类:

/* 新浪微博 */

.-mob-share-weibo{

background-image:url(图标连接)!important;

}

/* 腾讯微博 */

.-mob-share-tencentweibo{

background-image:url(图标连接)!important;

}

/* QQ空间 */

.-mob-share-qzone{

background-image:url(图标连接)!important;

}

...

事件

mobShare组件默认为一些元素绑定了点击(click)事件,你可以把这些ID放到自定义的网页元素中,以便更改UI,下面是事件列表

ID 动作

-mob-share-open显示class为-mob-share-ui元素(打开分享界面)

-mob-share-close关闭class为-mob-share-ui元素(关闭分享界面)

-mob-share-weibo分享至新浪微博

-mob-share-tencentweibo分享至腾讯微博

-mob-share-qzone分享至QQ空间

注:-mob-share-平台ID 表示分享至该平台( 点击查看所有平台ID

下面代码演示了只引入分享脚本的情况下,自定义一个按钮分享到新浪微博的例子


自定义例子:

分享到新浪微博// 实例一个新浪微博的分享对象

var weibo = mobShare( 'weibo' );

// 然后通过用户事件触发分享(浏览器限制原因,打开新窗口必需通过用户事件触发)

// 原生js的使用方法

document.getElementById( 'share_weibo' ).onclick = function() {

weibo.send();

}

// jquery库的使用方法

$( '#share_weibo' ).click( function() {

weibo.send();

} );

想要查看自定义的分享方法请点击这里 API !!!


希望本片博客可能帮助到那些需要帮助的人!!!

每天更新学到的东西!学无止境!!!!

本文根据 Mob官网书写 !!!!致敬!!!!