1
How to make high scoll when loading the page?
I’m trying to do this, but without success!
File: messages.php
$('.chatUsuariosLista').click(function() {
idUsuario = this.id;
$("#chatMsg").load('inc_chatMensagens.php?de='+idUsuario+'¶='+$("#para").val());
$("#para").val(idUsuario);
$('#chat2').attr({scrollTop: $('#chat2').attr('scrollHeight')});
});
I tried to put the code $('#chat2').attr({scrollTop: $('#chat2').attr('scrollHeight')});
inside the inc_chatMensagens.php file, but it also doesn’t work.
inc_chatMensagens.php file
<div id="chat2">
<ul>
<?php while ($row = $rs->fetch_assoc()) {?>
<?php if ($_GET['de'] == $row['de']) {?>
<li>
<div class="bubble">
<span class="personName">Cliente:</span> <br>
<span class="personSay"><?php echo $row['msg']; ?></span> <br>
<span class="time"><?php echo $row['data']; ?></span>
</div>
</li>
<?php }else{ ?>
<li>
<div class="bubble2">
<span class="personName2">Você:</span> <br>
<span class="personSay2"><?php echo $row['msg']; ?></span><br>
<span class="time2"><?php echo $row['data']; ?></span>
</div>
</li>
<?php } ?>
<?php } ?>
</ul>
</div>
Maybe you’re looking for the function
.scrollIntoView()
?– Mateus
@Mateusa. I saw that it doesn’t work in most browsers.
– Tiago
I didn’t send you an answer necessarily for that. Your question is a bit confusing, do you want to make the scroll climb to the top, or even some other message? If it goes straight to the top, this reply can help you (Beyond animation). However if it is for a defined element, select it and run the function, example:
document.getElementById("bubble").scrollIntoView();
, could test to see if everything is in order?– Mateus
@Mateusa. I’m trying to keep the scroll always down as in chat where messages appear and scroll down automatically.
– Tiago
I know you’re using elements like
li
to identify the messages by the code you deleted, so try using this:$("html,body").animate({scrollTop: $('ul#mensagens li:last').offset().top});
(based in that post) In this case I usedul#mensagens
, then you must add aid="mensagens"
for your type elementul
.– Mateus
Here is an example: http://jsfiddle.net/GEsmb/155/
– Mateus
@Mateusa. Good morning. It worked in part...rsrs. It is running all over the screen and not only in the div scoll.
– Tiago
Yes, I’m sorry... I understood the question differently. I’m going to publish it as an answer now...
– Mateus