js实现超过页面一屏后，点击图标滚动到页面顶部top

最新推荐文章于 2023-03-30 23:35:36 发布

VIP文章 nb_pdd

最新推荐文章于 2023-03-30 23:35:36 发布

阅读量5.5k

点赞数

分类专栏： jquery 文章标签： scroll function html jquery 数据库 go

本文链接：https://blog.csdn.net/nb_pdd/article/details/6047741

版权

引用的样式如下（实现top图标永远处在右下角位置）：
<style type="text/css">
#toTop {
    bottom: 0;
    cursor: pointer;
    padding: 0 0 1em;
    position: fixed;
    right: 0;
    width: 38px;
}

</style>

js如下：
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>      //引用jquery数据库
<img id="toTop" src="images/scroll_to_top.gif" width="38" height="68" alt="Scroll to Top" title="Scroll to Top" />
<script type="text/javascript">
$(document).ready(function() {
    var ScrolltoTop = $("#toTop");
    $(ScrolltoTop).hide();
    $(window).scroll(function() {
        if ($(window).scrollTop() == "0") {
            $(ScrolltoTop).fadeOut("slow")
        } else {
            $(ScrolltoTop).fadeIn("slow")
        }
    });
    $(ScrolltoTop).click(function() {
        $('html, body').animate({
            scrollTop: 0
        },
        700)
    })
});
</script>