当滚动条滚到一定区域内加载

写此内容是为了方便以后忘记的时候可以容易找到！以下是个人见解！

有时不让页面一开始加载全部的话，可以控制当滚动条滚动一定区域内才开始加载。以下是个小例子

 

代码
<head>
    <title>无标题页</title>
    <script type="text/javascript">
        function Comment()
        {
            var com = document.getElementById("Comment");
            var dom = (document.compatMode&&document.compatMode=="CSS1Compat")?document.documentElement:document.body;
            var sTop = dom.scrollTop;
            if(com.offsetTop-sTop-dom.clientWidth<=200)
                alert("开始加载");
            else
                setTimeout("Comment()",1000);
        }
        setTimeout("Comment()",1000);
    </script>
</head>
<body>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<div id="Comment">
    评论区域
</div>
</body>

 

 

其中document.compatMode，可以用来判断当前页面采用的渲染方式。

BackCompat：标准兼容模式关闭。
CSS1Compat：标准兼容模式开启。

 

当document.compatMode等于BackCompat时，浏览器客户区宽度是document.body.clientWidth；
当document.compatMode等于CSS1Compat时，浏览器客户区宽度是document.documentElement.clientWidth。

浏览器客户区高度、滚动条高度、滚动条的Left、滚动条的Top等等都是上面的情况。

 

posted @ 2010-08-20 00:06  蓝丶 sky  阅读(494)  评论(1)  编辑  收藏  举报