2014-01-19 13 views
14

Ich möchte div scroll erkennen. Was dieser Code macht, ist das ganze Fenster scrollen zu erkennen: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; 

      }); 

     } 
    } 
}); 

});

Hier ist mein HTML-Code.

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

Ich habe die Div-ID verwendet, aber es gibt nichts statt zwei aus.

Antwort

30

Nicht sicher, aber man kann nur die div von id, Klasse verweisen, usw. in der Spirale() Funktion:

Hier ist ein einfaches jsfiddle: http://jsfiddle.net/collabcoders/v2RbN/

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

Aktualisiert: 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

ich überarbeitete meine Frage Sir, werfen Sie einen Blick http://StackOverflow.com/Questions/21212051/Jquery-Find-if-Div-Reached-the-Bottom-on-Scroll – user3196424

+0

ok aktualisiert die Code – johnnyarguelles

+2

es hat funktioniert, vielen Dank! Du hast mein Leben vor dem Präsidenten und Vizepräsidenten meiner Schule gerettet! – user3196424