在上一篇文章中,我介绍了一种分享的方式,他有一定的局限性,当你要分享的网址有参数且不止一个时,你会发现他分享出去的网址参数不全。这篇文章是对上一篇文章的一个补充,也可以说是另一种写法。我们布好局后,点击相应图标来触发他分享功能的a标签,这样也可以实现分享功能,并且简单可靠。下面我来给大家说一下具体的方法。
我们还用jiathis来做例子。首先我们需要引入他给好的代码。
<!-- JiaThis Button BEGIN -->
<div class="jiathis_style_32x32" >
<a id="kongjian" class="jiathis_button_qzone" style="margin-right:10px;"></a>
<a class="jiathis_button_tsina"></a>
<a class="jiathis_button_tqq"></a>
<a class="jiathis_button_weixin"></a>
<a class="jiathis_button_cqq"></a>
<a class="jiathis_button_douban"></a>
</div>
<script type="text/javascript" src="http://v3.jiathis.com/code/jia.js" charset="utf-8"></script>
<!-- JiaThis Button END -->
将这段代码插入到</body>标签之前。有的朋友会说了,这样引入之后他的图标就正常显示出来了,要怎样将他隐藏呢,其实很简单,给他设置css属性,让他非常的小,并且他的z-index属性值小于其他层的值,让他位于其它层之下,这样就达到了隐藏的效果。
下面就是我们要点击的图片了
<img onclick="kongjian()" src="img/weixin.jpg">
给这个图片设置一个onclick事件,在js中设置一下,看一下代码。
<script>
function kongjian(){
document.getElementById("kongjian").click();
}
</script>
这样就实现了点击图片时触发点击a标签的效果。这只是其中一个例子,大家有兴趣的可以多试试其他的,只要给相应的a标签设置id,然后设置点击事件即可。