当一个div到达终点时附加另一个div

时间:2013-09-27 13:22:17

标签: javascript jquery css

我想在一个div到达结尾时显示一个div。我已经尝试了但是它没有正常工作。对此有任何帮助。(将div(#right)中的文本对齐成几行以便你将得到一个垂直的scrool酒吧并尝试)

以下是代码:

<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");
        }
        alert("End");
    });
 </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:50px;
         height:50px;
         background-color:yellow;
      }
   </style>
   </head>
   <body>

     <div id="left"></div>

        <div id="right">
         abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz
        </div>

     <div id="footer" style="display:none"></div>

   </body>
   </html>

JSFiddle Demo

0 个答案:

没有答案