Автоматическая прокрутка дива вниз
Подскажите как сделать, что бы прокрутка в диве автоматически опускалась вниз, желательно варианты решения на jquery.
Заранее всем спасибо. |
divElement.scrollTop = 9999; |
Цитата:
|
Подскажите куда это вставить? Желательно простенький примерчик. Заранее спасибо.
|
Вешаете обработчик (на onclick/onload/еще какое нибудь событие), далее получаете элемент при помощи getElementById(element) и свойству scrollTop этого элемента присваиваете значение.
|
<div id="messages" style="height: 400px; overflow: auto;" onload="this.scrollTop = 9999;"></div>
я правильно понял?.. все равно что-то не получается =( |
Ну еще бы получилось с overflow: auto, вопрос был про scroll следовательно и overflow: scroll;
Вот пример:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scroll</title>
<style type="text/css">
#scroll{
height:100px;
overflow:scroll;
background-color:#ddd;
}
</style>
<script type="text/javascript">
window.onload = function(){
document.getElementById('scroll').scrollTop = 9999;
}
</script>
</head>
<body>
<div id="scroll">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>Конец
</div>
</body>
</html>
|
при onclick получается... но как сделать автоматически без участия пользователя? просто у меня чат и нужно чтобы при появлении нового сообщения автоматом вниз пролистывалось... onresize тоже не работает... =(
P.S. а что ты там говоришь про window.onload? Если можно пиши сразу мой исправленный вариант. Заранее спасибо! |
Ну если при появлении нового сообщения, то если при его появлении полностью перезагружается страница (см. пример выше), если сообщения поступают асинхронно, то вешать на функцию срабатывающую по событию прихода сообщения и все.
|
Чтоб автоматически и нет возможности вписать код в функцию, которая добавляет сообщение, то можно и интервал сделать:
window.onload = function(){
var scrollinDiv = document.getElementById('scroll');
setInterval(function() {
scrollinDiv.scrollTop = 9999;
}, 100);
}
|
Цитата:
|
Цитата:
|
Ну дык при auto они отображаются, если надо. А если не надо, то и прокручивать нечего, будь там хоть auto, хоть scroll, хоть hidden.
|
Сообщения добавляются асинхронно, сделано через библиотеку JsHttpRequest и фиг там разберешься, поэтому найти функцию срабатывающую по событию прихода сообщения я не могу. А насчет интервала что-то не хочет опять работать... =(
|
Я чат сделал с прокруткой вверх: Севастополь - Чат потому как если постоянно позиционировать на нижней мессаге, то при просмотре истории будет каждую перезагрузку сбиваться фокус на мессагах, а это жутко напрягает.
|
Вы видели дату сообщения?
Так и хочется написать: |
Достаточно просто написать DIV.scrollTop(5*DIV.height());
Использование высоты будет лучшим вариантом так как мало ли если например поле чата ну получиться больше 9999 пикселей)))))) А так для любой высоты пойдет! |
| Часовой пояс GMT +3, время: 21:07. |