scroll infini jquery

j'ai essayé d'appliquer un tuto a un projet perso, cependant , je me heurte un probleme , en faite, je ne veux pas que mes commentaires s'affichent sur toute la page , donc j'ai mis tout ca dans un div

Code:

1
2
3
4
5
#comments{
                overflow: auto;
                width: 300px;
                height: 400px;
            }

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div id="comments">
                <?php
                $conn = mysqli_connect('localhost', 'root', '', 'test', '3306');
                if (!$conn) {
                    die('Could not connect to MySQL: ' . mysqli_connect_error());
                }
                mysqli_query($conn, 'SET NAMES \'utf8\'');
 
                $result = mysqli_query($conn, 'SELECT * FROM comments LIMIT 0 , 10');
                while (($row = mysqli_fetch_object($result)) != NULL) {
                    echo'<div class="comment" id="' . $row->id . '">';
                    echo '<h2>' . $row->subject . '</h2>';
                    echo '<p>' . $row->message . '</p>';
                    echo'</div>';
                }
                mysqli_free_result($result);
                mysqli_close($conn);
                ?>
</div>

dans le tuto , il detecte la fin du scroll avec ce code , mais c'est fait pour la page entière

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<script type="text/javascript">
 
            $("#comments").scroll(function(e){
                console.log($(this).height());              
 
                console.log($(this).scrollTop());                
                if($(window).scrollTop()== $(document).height() - $(window).height()){
                    console.log("fin du scroll ...");
             }
 
 
        });
 
        </script>

comment detecter la fin du scroll sur ce type de div ? merci d'avance .

je reviens pour donner la solution :

Code:

1
2
3
4
5
6
7
 
 
$("#comments").scroll(function(e){               
                 if ($(this)[0].scrollHeight - $(this).scrollTop() <= $(this).outerHeight()) {
                         // We're at the bottom.
                         alert("yeah !");
                    }

ca marche sur les derniers navigateurs , pour le reste , pas tester .

une autre approche
http://javascript.developpez.com/faq...derAutomatique