jQuery右侧边栏微信二维码QQ在线客服返回顶部代码

这款jQuery右侧边栏二维码QQ客服返回顶部代码，简洁的jQuery右侧栏客服代码，有微信二维码、QQ、电话显示及返回顶部功能，网页右侧悬浮层，鼠标移动上去有效果。

js代码

<script type="text/javascript">

$(function() {

$("#service a").hover(function() {

if ($(this).prop("className") == "weixin_area") {

$(this).children("img.hides").show();

} else {

$(this).children("div.hides").show();

$(this).children("img.shows").hide();

$(this).children("div.hides").animate({marginRight: '0px'}, '0');

}

}, function() {

if ($(this).prop("className") == "weixin_area") {

$(this).children("img.hides").hide();

} else {

$(this).children("div.hides").animate({marginRight: '-163px'}, 0, function() {

$(this).hide();

$(this).next("img.shows").show();

});

}

});

 

$("#top_btn").click(function() {

$("html,body").animate({scrollTop: 0}, 600);

});

 

//右侧导航 - 二维码

$(".weixin_area").hover(function() {

$(this).children(".weixin").show();

},function(){

$(this).children(".weixin").hide();

})

});

</script>

具体效果看下方【演示地址】吧^_^