返回顶部及去底部

               

网页中,常常需要在页侧加个 返回顶部、到达底部 之类的功能。

以往,我只知道要用个锚,但点了以后,地址栏后面会带个“#”,显得十分落后和弱智。

其实也可以用JS脚本来实现:

到达顶部:

 window.scrollTo(0, 0);

到达底部:

 window.scrollTo(0, 99999);//一般页面长度都不够99999吧?


页侧固定的,不随页面一起滚动区域:

CSS

扫描二维码关注公众号,回复: 5331395 查看本文章
<style type="text/css">#divPanel{position:fixed;top:50px;right:250px;width:20px;height:650px; background-color:#FBDBE6;cursor:pointer;padding:0;font-size:12px;text-align:center;}        #divNext{height:580px;padding-top:10px;background-color:#FFDFF7;}        #divGoToBottom{height:60px;margin-top:5px; background-color:#FBaaaa;padding-top:10px;}    </style>

HTML

    <div id="divPanel">        <div id="divNext" onclick="NextPage()">下一个</div>        <div id="divGoToBottom" onclick="GoToBottom()">到底部</div>    </div>

javascript

    <script type="text/javascript">        function NextPage() {            var objNext = document.getElementById("<%=btnNext.ClientID %>");            if (objNext.disabled == true) {                alert("已是最后一张。");                window.close();            }            else                objNext.click();        }        function GoToBottom() {            window.scrollTo(0, 99999);            return false;        }    </script>





           

再分享一下我老师大神的人工智能教程吧。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!https://blog.csdn.net/jiangjunshow

猜你喜欢

转载自blog.csdn.net/hddfuuh/article/details/87541898
今日推荐