“返回顶部”按钮

实现过程

当页面滚动时(监听scroll事件),浏览器滚动条处于最顶部时,隐藏“返回顶部”按钮,当滚动条继续向下滚动时,动态计算出当前可视窗口的高度-按钮高度-按钮距浏览器下边缘高度得到的值,如果这个值大于某个特定的数字时,显示“返回顶部”按钮,否则隐藏。然后,当单击“返回顶部”按钮时,其实应该是一个链接,将滚动条滚回浏览器最顶部。在这个过程中,我们可以使用animate来创建动画效果,即返回顶部时有个过渡效果。

$(function(){ 
    $(".backToTop").goToTop(); 
    $(window).bind('scroll resize',function(){ 
        $(".backToTop").goToTop(); 
    }); 
}); 

 

 

var controlTop=$window.height() - $this.height()-opts.pageHeightJg;
            controlTop=cssfixedsupport ? $window.scrollTop() + controlTop : controlTop;
            var shouldvisible=( $window.scrollTop() >= opts.startline )? true : false;
            
            if (shouldvisible){
                $this.stop().show();
            }else{
                $this.stop().hide();
            }

 

 http://www.helloweba.com/view-blog-196.html

posted on 2015-07-27 10:56  yy2056  阅读(227)  评论(0)    收藏  举报

导航