zoukankan      html  css  js  c++  java
  • 计算滚动条滚动的距离

    方法一:
    var loadLock = false; function loadMore() { if(jQuery('#bodyid').size() == 0)return ; document.getElementById("bodyid").style.height=document.body.clientHeight; var doe = document.documentElement || document.body, scrollHeight = doe.scrollHeight, clientHeight = doe.clientHeight, scrollY = window.scrollY || doe.scrollTop,//滚动条滚动的距离 offset = scrollHeight - scrollY - clientHeight; if(scrollY<=20&&scrollY>=0){ document.getElementById("topBtn").style.display="none"; } else if(scrollY>20&&offset<=100){ document.getElementById("topBtn").style.display="block"; document.getElementById("topBtn").style.cssText="bottom:100px;"; }else if(scrollY>20&&offset>100){ document.getElementById("topBtn").style.display="block"; document.getElementById("topBtn").style.cssText="bottom:10px;"; } } window.onscroll = function() { loadMore(); };
    方法二:
    //回到页面顶部  
            $("#goTotop").click(function(){  
                $('body,html').animate({scrollTop:0},1500); //点击按钮让其回到页面顶部  
            });  
              
            $(window).scroll(function() {  
                var yheight1=window.pageYOffset; //滚动条距顶端的距离  
                var yheight=getScrollTop(); //滚动条距顶端的距离  
                var height =document.documentElement.clientHeight//浏览器可视化窗口的大小  
                var top=parseInt(yheight)+parseInt(height)-217;  
                var divobj=$(".kf");  
                divobj.attr('style','top:'+top+'px;');  
            })  
              
        /**
         * 获取滚动条距离顶端的距离
         * @return {}支持IE6
         */  
        function getScrollTop() {  
                var scrollPos;  
                if (window.pageYOffset) {  
                scrollPos = window.pageYOffset; }  
                else if (document.compatMode && document.compatMode != 'BackCompat')  
                { scrollPos = document.documentElement.scrollTop; }  
                else if (document.body) { scrollPos = document.body.scrollTop; }   
                return scrollPos;   
        }  


  • 相关阅读:
    开源一个适用iOS的数据库表结构更新机制的代码
    耗油是什么??主要起什么作用???_百度知道
    跨平台C++ 功能全面的Socket类库,支持TCP,UDP,限速等等_陈华_新浪博客
    ASICME Avalon|阿瓦隆比特币矿机
    水淀粉_百度百科
    HyperDex.org
    不忘初心:从阿里运维工程师到水果贩子的“降级”路 | 卖水果的工程师
    用Github账号领Ripple币
    简洁 轻快 完美支持 Windows 8 Modern UI 单行输入,轻盈流畅
    赴美旅游签证,不求人!
  • 原文地址:https://www.cnblogs.com/dearxinli/p/2766157.html
Copyright © 2011-2022 走看看