Discussion :

[speedylol]

Bonjour voilà j'essaye de faire défiler les derniers messages d'un chat par le bas .

premier script celui si affiche bien les messages entre div

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
var auto_refresh = setInterval(
function()
{
    $('#mondiv').load('tchat_lu.php',function() {
    $('#mondiv').scrollTop($('#mondiv')[0].scrollHeight);
 
    });
}, 2000);

deuxième lui rien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var auto_refresh = setInterval(
function() {
  // initialise le scroll au bas de l'élément
  $('#mondiv').load('tchat_lu.php',function() {
  $("#mondiv")[0].scrollTop = $("#mondiv")[0].scrollHeight;
 
    var box = $("#mondiv")[0];
 
    // on vérifie si le scroll est en bas de l'élément
    var toBottom = box.offsetHeight + box.scrollTop >= box.scrollHeight;
 
    // on ajoute le message
    $("#mondiv").append('\nnouvelle ligne');
 
    // si le scroll était en bas avant l'ajout du message, on scroll vers le bas
  	if (toBottom) {
  		$("#mondiv").animate({scrollTop: $("#mondiv")[0].scrollHeight);
      console.log('scroll down');
 
	}
  };2000);
});

[danielhagnoul]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
var
  jObjMonDiv = $( '#mondiv' ),
  auto_refresh = setInterval( function(){
    jObjMonDiv.load( 'tchat_lu.php', function(){
      jObjMonDiv
        .append( '<p>nouvelle ligne</p>' )
        .scrollTop( jObjMonDiv[0].scrollHeight ); 
    });
  }, 3000 );

[speedylol]

Bonjour, merci de ta réponse mais je viens de tester la partie de ton script cela ne fonctionne pas pour l'affichage des messages.

voilà celui de base que j'avais réalisé et lui m'affiche tout les messages.

les nouveaux vers les bas les anciens vers le haut)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
	function loadLog(){		
		var oldscrollHeight = $("#mondiv").attr("scrollHeight") - 20; 
		$.ajax({
			url: "tchat_lu.php",
			cache: false,
			success: function(html){		
				$("#mondiv").html(html); 	
 
				//Auto-scroll			
				var newscrollHeight = $("#mondiv").attr("scrollHeight") - 20; // ScrollHeight après la demande
				if(newscrollHeight > oldscrollHeight){
					$("#mondiv").animate({ scrollTop: newscrollHeight }, 'normal'); // Défilement automatique en bas de div
				}				
		  	},
		});
	}
setInterval (loadLog, 2500);

[speedylol]

bonjour je suis pas loin de la solutions le scroll bar doit être en dessous la il remonte a chaque message

[speedylol]

Voilà j'ai trouvé ;-)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function loadLog(){	
       var oldscrollHeight = $("#mondiv")[0].scrollHeight;
       $.ajax({
		   url: "tchat_lu.php",
		   cache: false,
		   success: function(html){		
				$("#mondiv").html(html);
 
    var newscrollHeight = $("#mondiv")[0].scrollHeight;
    if(newscrollHeight > oldscrollHeight){ 
        $("#mondiv").scrollTop($("#mondiv")[0].scrollHeight);
		} 
    },
 
  });
}
setInterval (loadLog, 2000);

[speedylol]

bonjour je sais pas si je trouverais la bonne solutions ici mais je cherche une solution, pour un chat que les dernier message s' ajoute du bas vers le haut

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
var auto_refresh = setInterval(
function()
{
    $('#mondiv').load('tchat_lu.php',function() {
    ('#mondiv').scrollTop($('#mondiv')[0].scrollHeight);
 
 
    });
}, 2000);

Note de la modération : message ajouté suite à déplacement.