detection of the scrolling to the end of an element using jQuery
see:http://stackoverflow.com/questions/6271237/detecting-when-user-scrolls-to-bottom-of-div-with-jquery/6271466#6271466
by Luke Marlow
HTML
<div id="flux">
Lorem ipsum dolor sit amet <br>
Consectetuer augue nibh lacus at <br>
Pretium Donec felis dolor penatibus <br>
Phasellus consequat Vivamus dui lacinia <br>
Ornare nonummy laoreet lacus Donec <br>
Ut ut libero Curabitur id <br>
Dui pretium hendrerit sapien Pellentesque <br>
</div>
<div id="information"></div>
CSS
#flux{width:200px;height:150px;overflow:auto;}
JavaScript
var text = '<hr />\
Lorem ipsum dolor sit amet <br>\
Consectetuer augue nibh lacus at <br>\
Pretium Donec felis dolor penatibus <br>\
Phasellus consequat Vivamus dui lacinia <br>\
Ornare nonummy laoreet lacus Donec <br>\
Ut ut libero Curabitur id <br>\
Dui pretium hendrerit sapien Pellentesque <br>';
jQuery(function($) {
$('#flux').bind('scroll', function() {
if ($(this).scrollTop() + $(this).innerHeight()>=$(this)[0].scrollHeight) {
$('#information').html('loading...');
setTimeout(function() {
$('#flux').html($('#flux').html()+'<hr>'+$('#flux').html());
$('#information').html( $('#information').text().length );
}, 1000);
}
})
});