鼠标滚动超过1屏显示置顶图标

来源:互联网 发布:软件评测师培训费用 编辑:程序博客网 时间:2024/06/08 17:57
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />    <meta content="yes" name="apple-mobile-web-app-capable" />    <meta content="black" name="apple-mobile-web-app-status-bar-style" />    <meta content="telephone=no" name="format-detection" />    <style type="text/css">        * {            margin: 0;            padding: 0;        }        body {            max-width: 640px;            margin: 0 auto        }        .div1 {            background: #D5D4D4;            height: 500px;            margin-bottom: 10px;            overflow: hidden;            font-size: 50px;        }        .div2 {            background: #D5D4D4;            height: 500px;            margin-bottom: 10px;            overflow: hidden;            font-size: 50px;        }        .div3 {            background: #D5D4D4;            height: 500px;            margin-bottom: 10px;            overflow: hidden;            font-size: 50px;        }        #scrollSearchDiv {            width: 40px;            height: 40px;            line-height: 40px;            border: solid 1px #07AC72;            display: none;            position: fixed;            right: 30px;            bottom: 30px;            text-align: center;            font-size: 12px;            color: #fff;        }    </style></head><body>    <div class="div1 J_payBottomShow J_payPopupShow">1</div>    <div class="div2  J_payPopupShow">2</div>    <div class="div3  J_payPopupShow">3</div>    <!--这个直接用首页返回顶部的图标  -->    <div id="scrollSearchDiv"><a href="#">^</a></div>    <script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>    <script type="text/javascript">        $(function() {            //绑定滚动条事件             $(window).bind("scroll", function() {                var sTop = $(window).scrollTop();                var sTop = parseInt(sTop);                if (sTop >= 130) {                    if (!$("#scrollSearchDiv").is(":visible")) {                        try {                            $("#scrollSearchDiv").slideDown();                        } catch (e) {                            $("#scrollSearchDiv").show();                        }                    }                } else {                    if ($("#scrollSearchDiv").is(":visible")) {                        try {                            $("#scrollSearchDiv").slideUp();                        } catch (e) {                            $("#scrollSearchDiv").hide();                        }                    }                }            });        })    </script></body></html>
原创粉丝点击