头像

jQuery右侧固定悬浮客服+二维码+返回顶部按钮代码【原创

来源:http://www.sucaihuo.com/js/3693 素材火管理员 2018-05-17 10:32浏览(1009) 收藏

一款好看又好用的jQuery右侧固定悬浮客服+二维码+返回顶部按钮代码,网页右侧QQ在线客服代码,网页滚动时也一直固定不动。
jQuery右侧固定悬浮客服+二维码+返回顶部按钮代码
分类:悬浮层/弹出层 > 客服 难易:初级

程序员,你不是一个人;网站开发QQ群:698377651,在线充值,或联系QQ3401083589直接充值

查看演示 下载资源: 51 下载资源 下载积分: 30 积分

js代码

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

	/* ----- 侧边悬浮 ---- */
	$(document).on("mouseenter", ".suspension .a", function(){
		var _this = $(this);
		var s = $(".suspension");
		var isService = _this.hasClass("a-service");
		var isServicePhone = _this.hasClass("a-service-phone");
		var isQrcode = _this.hasClass("a-qrcode");
		if(isService){ s.find(".d-service").show().siblings(".d").hide();}
		if(isServicePhone){ s.find(".d-service-phone").show().siblings(".d").hide();}
		if(isQrcode){ s.find(".d-qrcode").show().siblings(".d").hide();}
	});
	$(document).on("mouseleave", ".suspension, .suspension .a-top", function(){
		$(".suspension").find(".d").hide();
	});
	$(document).on("mouseenter", ".suspension .a-top", function(){
		$(".suspension").find(".d").hide(); 
	});
	$(document).on("click", ".suspension .a-top", function(){
		$("html,body").animate({scrollTop: 0});
	});
	$(window).scroll(function(){
		var st = $(document).scrollTop();
		var $top = $(".suspension .a-top");
		if(st > 400){
			$top.css({display: 'block'});
		}else{
			if ($top.is(":visible")) {
				$top.hide();
			}
		}
	});
	
});	
</script>
声明:本文为原创文章,如需转载,请注明来源sucaihuo.com并保留原文链接:https://www.sucaihuo.com/js/3693.html
最新交易
评论6
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 3401083589

  • 头像 5楼
    05-20 09:22
    en***37
    效果还挺好看的啊。。。在线客服
  • 头像 4楼
    05-20 08:40
    to***ki
    正在找这个非常的使用
  • 头像 3楼
    05-18 09:55
    ga***41
    非常实用的功能,感谢分享,下载来备用
  • 头像 板凳
    05-18 09:20
    心***扬
    大赞一下,好评,楼主好人
  • 头像 椅子
    05-18 09:06
    at***at
    实用小工具,厉害
  • 头像 沙发
    05-17 23:09
    一***钱
    这个挺好,样式很漂亮。
1 2