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

92模板   2020-07-30   收藏本文
这是一款jQuery右侧边栏二维码QQ客服返回顶部代码,简洁的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>

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

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

演示地址 下载地址A 下载地址B

相关特效

    暂无数据
免责声明:本站模板均来自用户分享和网络收集,仅供学习与参考,请勿用于商业用途,若损害您的权利,请联系网站客服,核实后立即删除。
展开