2014-01-19 7 views
14

Я хочу обнаружить прокрутку div. Что делает этот код, так это обнаружение всего прокрутки окна:Detect div scroll jquery

$(document).ready(function() { 
var track_load = 0; //total loaded record group(s) 
var loading = false; //to prevents multipal ajax loads 
var total_groups = <?php echo $total_groups; ?>; //total record group(s) 

$('#results').load("autoload_process.php", {'group_no':track_load}, function() {track_load++;}); //load first group 

$(window).scroll(function() { //detect page scroll 

    if($(window).scrollTop() + $(window).height() == $(document).height()) //user scrolled to bottom of the page? 
    { 

     if(track_load <= total_groups && loading==false) //there's more data to load 
     { 
      loading = true; //prevent further ajax loading 
      $('.animation_image').show(); //show loading image 

      //load data from the server using a HTTP POST request 
      $.post('autoload_process.php',{'group_no': track_load}, function(data){ 

       $("#results").append(data); //append received data into the element 

       //hide loading image 
       $('.animation_image').hide(); //hide loading image once data is received 

       track_load++; //loaded group increment 
       loading = false; 

      }).fail(function(xhr, ajaxOptions, thrownError) { //any errors? 

       alert(thrownError); //alert with HTTP error 
       $('.animation_image').hide(); //hide loading image 
       loading = false; 

      }); 

     } 
    } 
}); 

});

Вот мой код HTML.

<div id="scrollingbox"> 
<ol id="results"> 
</ol> 
<div class="animation_image" style="display:none" align="center"><img src="ajax-loader.gif"></div> 
</div> 

Я использовал идентификатор div, но он не выводит ничего вместо двух.

ответ

30

Не уверен, но вы можете просто ссылаться на DIV по идентификатору, класс и т.д. в свитке() функция:

Вот простой jsfiddle: http://jsfiddle.net/collabcoders/v2RbN/

$(".box").scroll(function() { //.box is the class of the div 
    $("span").css("display", "inline").fadeOut("slow"); 
}); 

Обновлено: http://jsfiddle.net/collabcoders/v2RbN/1/

$("span").hide(); 

$(".box").scroll(function() { 
    if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) { 
     $("span").show();  
    } else { 
     $("span").hide(); 
    } 
}); 
+0

Я пересмотрел свой вопрос, сэр, посмотрите http://stackoverflow.com/questions/21212051/jquery-find-if-div-reached-the-bottom-on-scroll – user3196424

+0

ok обновлено код – johnnyarguelles

+2

он работал, спасибо ver много! Вы спасли мою жизнь от президента и вице-президента моей школы! – user3196424