Форум dkLab и Denwer
Здесь общаются Web-разработчики.
Генеральный спонсор:
Хостинг «Джино»

div и автоскроллинг (fanom_)
Author Message
fanom_
Guest





Карма: 388
   поощрить/наказать


PostPosted: Wed Jan 21, 2009 1:22 pm (написано за 4 секунды)
   Post subject: div и автоскроллинг
Reply with quote

Вообщем делаю "ajax чат" есть такой див
<div style="width:60%; height:400px;overflow: auto; " id="chat">
здесь сообщения чата
второе
третее
</div>

сообщения идут сверху вниз, как и должно быть в нормальных чатах)
но при достижение границы, появляется скролл, и следующие сообщения невидны за нижней границей, приходится мышкой тащить скролл,
как сделать чтобы скролл автоматически опускался?

ищу решение без фреймов.
Back to top
Ksnk
Участник форума



Joined: 24 Jun 2005
Posts: 459
Карма: 49
   поощрить/наказать

Location: СПб

PostPosted: Wed Jan 21, 2009 4:04 pm (спустя 2 часа 42 минуты; написано за 51 секунду)
   Post subject:
Reply with quote

Code (html): скопировать код в буфер обмена
<div (december.com/html/4/element/div.html) style="overflow:auto;" onclick="document.getElementById('anchor').scrollIntoView(false);"> (december.com/html/4/element/.html)

<span (december.com/html/4/element/span.html) id="anchor"> (december.com/html/4/element/.html)&nbsp;</span>
</div>
Вставлять сообщения перед(insertBefore) "anchor".
Back to top
View user's profile Send private message Send e-mail
Guest






Карма: 388
   поощрить/наказать


PostPosted: Wed Jan 21, 2009 4:11 pm (спустя 6 минут)
   Post subject:
Reply with quote

<div style="width:60%; height:400px;overflow: auto; " id="chat">
<div id="chat_msgs">здесь сообщения чата
второе
третее
</div>
<a href="#bottom_line"></a>
</div>
после подгрузки сообщений, яваскриптом переходить на ссылку
Back to top
Denis Usenko
Участник форума



Joined: 06 Feb 2006
Posts: 54
Карма: 13
   поощрить/наказать


PostPosted: Thu Jan 22, 2009 7:05 am (спустя 14 часов 53 минуты; написано за 17 секунд)
   Post subject:
Reply with quote

fanom_
Quote:
как сделать чтобы скролл автоматически опускался?
С Вашей разметкой:
Code (html): скопировать код в буфер обмена
<div (december.com/html/4/element/div.html) style="width:60%; height:400px;overflow: auto; " id="chat"> (december.com/html/4/element/.html)
здесь сообщения чата
второе
третее
</div>
Это делается так:
Code (JavaScript): скопировать код в буфер обмена
var div = document.getElementById('chat')
div.scrollTop = div.scrollHeight;
Back to top
View user's profile Send private message
Guest






Карма: 388
   поощрить/наказать


PostPosted: Mon Mar 30, 2009 3:24 pm (спустя 2 месяца 9 дней 8 часов 18 минут; написано за 3 минуты 40 секунд)
   Post subject:
Reply with quote

Такой способ работает плохо:
    
var div = document.getElementById('chat')
div.scrollTop = div.scrollHeight;


Если у нас ajax - чат, то он обновляется каждых 1-5 секунд. Соответственно и скролить див нужно после перегрузки его содержимого.
Иногда все скролит хорошо, иногда скролит не после даного обноления сообщений чата, а после следующего.
Что касается оперы, то в ней вообще скроллинг скачит вверх-вниз.
Back to top
Display posts from previous:   
Post new topic   Reply to topic All times are GMT + 3 Hours
Page 1 of 1    Email to a Friend.
You cannot post new topics in this forum. You cannot reply to topics in this forum. You cannot edit your posts in this forum. You cannot delete your posts in this forum. You cannot vote in polls in this forum. You cannot attach files in this forum. You can download files in this forum.
XML