Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > как сделать плавную прокрутку

Автор: Рыжий 1.5.2005, 14:20

Здравствуйте!
У меня вопрос - все наверное знают что в чатах при добавлении нового сообщения экран "сползает" вниз к нему, чтобы его все увидели, как это можно сделать.
Я слышал есть такая функция scroll() но не нашел нигде ее описания smile

Какие у вас предложения?

Автор: Sardar 1.5.2005, 14:56

Сначала определись как у тебя окно чата реализованно smile

Если фрейм, то хоть scroll'ом, хоть scrollTop'пом, хоть scrollIntoView(права не плавно будет).
Если в слое, то первое не пойдёт.

Приведи конкретный код, получишь конкретный ответ.

Автор: Рыжий 1.5.2005, 15:08

чат реализован обыкновенными фреймами.
А можно поподробнее про scroll, scrollTop, scrollIntoView?? smile

Автор: Aliance 1.5.2005, 20:30

http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/scroll.asp
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/scrolltop.asp
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/scrollintoview.asp

Автор: Рыжий 2.5.2005, 15:45

Хм интерестно, почитал, много инфы но чето не хочет оно у меня работать, я пишу:

<body onload "scroll(0,100);">

И все равно ничего! если я пишу (в чате) уже идет 20 реплика а он все равно вверху, хотя разговор уже ушел в низ.
Тестирую в IE6 вроде все правильно, странно...

Автор: Sardar 2.5.2005, 16:13

Цитата(PHP @ 2.5.2005, 14:45)

body onload "scroll(0,100);"

Состна есть аттрибут, есть значение, синтаксис аттр=знач. (onload="scroll(0,100);") smile

Если бы у тебя окно чата постоянно не перезагружалось, то можно сделать красивую не моргающую плавную прокрутку. Естественно наличие JS обязательно. Кстати в твоем случае можно пользоваться якорями, тогда без JS всё будет работать.

НО, это жутко старо и не удобно. Плавная прокрутка нужна в чате где окошко с мессагами не мерцает и не перезагружается, следовательно загрузка идёт где то за кулисами(скрытый фрейм, подгружаемый скрипт, XMLHTTPRequest наконец), а затем контент вставлаяется в окошко и плавно прокручиваеться. В этом случае можно запустить "тред" с интервалом:

Код

window.setInterval(function(){
  self.scrollBy(0, 3);
 }, 100);

Страничка будет постоянно плавно скролиться вниз. Естественно после этого нужно отлавливать события мыши, дабы юзер проскролив страницу наверх почитать что было, не парился с постонянно скролящимся окошком smile

Автор: Рыжий 2.5.2005, 17:35

Цитата(Sardar @ 2.5.2005, 15:13)

синтаксис аттр=знач. (onload="scroll(0,100);")

Блин киньте камнем в меня все кто это видел, ну это ж нада такое пропустил smile

Кстати тебе + за все предоставленные советы!

Автор: Aliance 2.5.2005, 21:59

Лично я пользуюсь таким кодом:

Код


function scrollToTop() {
   if (document.body.scrollTop > "0") {
      document.body.scrollTop -= "100";
      scroll(0,document.body.scrollTop);
      setTimeout("scrollToTop()",10);
   }
}

Автор: Иль 12.7.2005, 12:16

Цитата(Aliance @ 2.5.2005, 21:59)

scroll(0,document.body.scrollTop);

А что разве document.body.scrollTop=44 не даст результата без scroll()?

Автор: Aliance 12.7.2005, 14:18

document.body.scrollTop - это координаты окна в ИЕ. Он возвращает значение, а метод (повторюсь, метод) делает прокрутку.

Автор: Иль 13.7.2005, 12:20

Aliance, но если я к любой другой ноде применю, ведь сработает же? Да?
document.getElementById('div1').scrollTop=0

Автор: Sardar 13.7.2005, 20:10

Угу, просто по барабану использовать метод scroll или scrollTop пока ты не запарился с доктайпами, ведь в XHTML body.scrollTop не может меняться, если не ошибаюсь.

Автор: Иль 13.7.2005, 21:13

Какой ужас, останусь ка я в каменном веке, пока с HTML 3.2 smile