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

作者 : 小刺猬 本文共897个字,预计阅读时间需要3分钟 发布时间: 2020-08-3 共404人阅读

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

基于jquery.1.11.1.min.js制作的简洁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>
VIP免费 永久VIP免费

已有0人支付


刺猬源码 » jQuery右侧边栏二维码QQ客服返回顶部代码

刺猬QQ交流群号多少?
363432

发表评论