<div class="codetitle"> <span><a style="CURSOR: pointer" data="86191" class="copybut" id="copybut86191" onclick="doCopy('code86191')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code86191"> <br><html xmlns="http://www.w3.org /1999/xhtml"> <br><head runat="server"> <br><title> Pull the scroll bar to load data</title> <br><script src="Scripts/jquery- 1.4.1.min.js" type="text/javascript"></script> <br><script type="text/javascript"> <br>$(function () { <br>var i = 4;$(window).bind("scroll", function (event) <br>{ <br>//The height from the scroll bar to the head of the web page, compatible with ie, ff, chrome <br>var top = document .documentElement.scrollTop document.body.scrollTop; <br>//Height of webpage<br>var textheight = $(document).height(); <br>//Height of webpage-top-current window height<br>if (textheight - top - $(window).height() <= 100) { if (i >= 100) { return; <br>//The control can only load up to 100 <br>} <br>$ ('#div1').css("height", $(document).height() 100);i ; <br>//You can obtain dynamic data and load it into div1 according to the actual situation <br>$('< ;div>' i '</div>').appendTo($('#div1')); <br>} <br>}); <br>}) <br></script> <br><style> <br>#div1 div <br>{ <br>font-size: 100px; <br>background: #ccc; <br>margin-top: 5px; <br>} <br>< /style> <br></head> <br><body> <br><form id="form1" runat="server"> <br><div style="height: 1000px;" id="div1"> <br><div> <br></div> <br><div> <br></div> <br><div> <br></ div> <br><div> <br></div> <br></div> <br></form> <br></body> <br></html> <br> </div>
