0

目前，当单击一个元素时，我会运行一个加载更多按钮，如下所示：

<script type="text/javascript">
     $(document).on('click', '#loadmore', function() {

         etc....
     });
</script>

但是当一个 div 进入浏览器的视图时，有没有办法让它运行？真的把它变成一个无限的负载？我一直在四处寻找，找不到任何解决方案，但这似乎是可能的。

那么用户将浏览页面，查看元素<div id="#loadmore">并且功能运行？

4

4 回答 4

3

你可以试试这个插件jquery-appear。

于 2012-04-12T16:00:09.967 回答
2

您也可以使用以下方法，即使我建议使用 xdazz 建议的库版本

//returns the size of the whole html
function getDocHeight() {
    var D = document;
    return Math.max(
        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
        Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );
}

//returns the size of the browser window
function viewport() {
    var e = window, a = 'inner';
    if ( !( 'innerWidth' in window ) ){
        a = 'client';
        e = document.documentElement || document.body;
    }
    return { width : e[ a+'Width' ] , height : e[ a+'Height' ] }
}

//register a scroll listener, that checks if you are at the end of the page
$(window).scroll(function(){
    if( $(window).scrollTop()+viewport()["height"] >= getDocHeight() ){
         //your method here
         loadMore();
    }
});
于 2012-04-12T16:28:55.657 回答
0 
if(window.addEventListener)
{
window.addEventListener("scroll", function() {
          var div = document.getElementById("myDiv");
          if(div.offsetTop <= window.innerHeight)
          {
               clearInterval(timer);
               // call your functions here
          });
}
else if(window.attachEvent)
{
     window.attachEvent("onscroll", function() {
          var div = document.getElementById("myDiv");
          if(div.offsetTop <= window.innerHeight)
          {
               clearInterval(timer);
               // call your functions here
          })
}
于 2012-04-12T16:45:24.290 回答
-2

http://api.jquery.com/visible-selector/

jquery可见选择器将起作用

于 2012-04-12T16:02:29.547 回答