简体   繁体   English

动态显示除法取决于另一个除法的滚动条位置

[英]showing a division dynamically depends on scroll bar position of another divison

I would like to show another div(#footer) . 我想显示另一个div(#footer) Whenever I scrolled to the end of a div(#right), have tried like this but it is not working. 每当我滚动到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>

Check out this link... 查看此链接...

How can I use JQuery to check if a div is scrolled all the way to the bottom? 如何使用JQuery检查div是否一直滚动到底部?

For your code just change the javascript to this.... 对于您的代码,只需将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();
  }
}

Shown here 如图所示

http://jsfiddle.net/rsP9p/ http://jsfiddle.net/rsP9p/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM