1

我想展示另一个div(#footer)。每当我滚动到 div(#right) 的末尾时,都尝试过这样但它不起作用。

  <html>
   <head>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
   <script>
      $(document).ready(function(){
        var bot=$('#right')[0].scrollHeight;
        var pos=$("#right")[0].scrollTop +$("#right")[0].clientHeight;
         if(bot==pos){
        $("#footer").css("display","block");
        }
        else{$("#footer").css("display","none");
        }
       });
    </script>
    <style type="text/css">
      #left{
          width:10px;
          height:100px;
          overflow:hidden;
          background-color:blue;
      }
     #right{
        width:52px;
        height:100px;
        overflow:auto;
        background-color:green;
        position:absolute;
        top:7px;left:20px;
      }
    #footer{
       width:70px;height:50px;
       background-color:yellow;
    }
 </style>
   </head>
   <body>
    <div id="left">
      </div>
      <div id="right">
         a  b  c  d  e  f  g  h  i  j  k  l  m  n  o  p  q  r  s  t  u  v  w  x  y  z 
    </div>
   <div id="footer" style="display:none">
   </div>
  </body>
</html>
4

1 回答 1

0

看看这个链接...

如何使用 JQuery 检查 div 是否一直滚动到底部?

对于您的代码,只需将 javascript 更改为此....

$(document).ready(function(){
  $('#right').bind('scroll',chk_scroll);
});


function chk_scroll(e)
{
  var elem = $(e.currentTarget);
  if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) 
  {
    $("#footer").show();
  }
}

显示在这里

http://jsfiddle.net/rsP9p/

于 2013-09-27T15:34:58.823 回答