返回顶部 JS 图片 悬浮

浏览数：14 / 时间：2015年06月09日

1、首先创建“返回顶部”元素

    <!-- toTop -->
    <div id="toTop" style="position: fixed; z-index:99; bottom:89px; right:60px; display:none;" >
        <a href="javascript:scroll(0,0)"><img src="${pageContext.request.contextPath}/images/toTop.png"/></a>
    </div>


2、为窗口的scroll事件绑定处理函数

//为窗口的scroll事件绑定处理函数    
    $(window).scroll(function(){        
        var min_height = window.screen.availHeight; 
        //获取窗口的滚动条的垂直位置        
        var s = $(window).scrollTop();        
        //当窗口的滚动条的垂直位置大于页面的最小高度时，让返回顶部元素渐现，否则渐隐        
        if( s > min_height){            
            $("#toTop").fadeIn(100);        
        }else{            
            $("#toTop").fadeOut(200);        
        };    
    });

搞定，附上返回顶部图标。

返回顶部 JS 图片 悬浮,古老的榕树,5-wow.com

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： 返回顶部 class style java sp src 返回顶部 class style java sp src

相关文章

随机文章

您可能还喜欢

您可能还喜欢