zoukankan      html  css  js  c++  java
  • 返回顶部 JS 图片 悬浮

    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);        
            };    
        });

    搞定,附上返回顶部图标

  • 相关阅读:
    标准模板库中的链表(list)
    C++接口
    qsort
    C++异常
    标准模板库中的向量(vector)
    后缀表达式/逆波兰表达式
    静态数据成员
    c++存储区域
    #define 和 const
    Git 的下载与安装
  • 原文地址:https://www.cnblogs.com/siyu/p/3853661.html
Copyright © 2011-2022 走看看