Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Как Google это делает ? (https://javascript.ru/forum/events/8287-kak-google-ehto-delaet.html)

cooli0 18.03.2010 16:11

Как Google это делает ?
 
Всем привет! Заинтересовался таким вопросом.

У гугла есть имплементация live твиттер модуля. Его можно увидеть, когда в поиске забит какой-то search term, который в данный момент широко обсуждаем на твиттере и других различных новостных порталах.

Пример

http://www.google.com/search?hl=en&s...=&oq=&gs_rfai=

Увидете Latest results for Consumer Prices Are Flat

Интересует такой момент, когда аяксовый запрос находит что-то новое, callback добавляет новый DIV в DOM. Этот DIV имеет отрицательный margin-top, который равен высоте дива. Высота не захардкоджена, она изменяется в зависимости от кол-ва контента. Я попробовал воспроизвести похожий эффект, но, высоту дива не узнать до его появления в DOM. Поэтому вставляю DIV без отрицательного margin-top и сразу же ставлю margin-top значение div.offsetHeight * (-1). При таком подходе в ИЕ6-8 (иногда и в FF) всегда видно, как контент прыгает. Как вы думаете, как гугл делает это так плавно и красиво ?

Gvozd 18.03.2010 16:23

Цитата:

Сообщение от cooli0
высоту дива не узнать до его появления в DOM

так сделайте его в DOM
только внутри другого элемента, невидимого
Цитата:

Сообщение от cooli0
как гугл делает это так плавно и красиво ?

фаербаг в руки, и проверяйте

Riim 18.03.2010 16:25

Один из вариантов:
> el.style.left = el.style.top = -999 + 'px';
> узнает высоту
> переносит div куда надо.

upd: упс, не успел.

cooli0 18.03.2010 16:54

Цитата:

Сообщение от Gvozd (Сообщение 48128)
так сделайте его в DOM
только внутри другого элемента, невидимого

фаербаг в руки, и проверяйте

фаербаг в руках естесственно))

absolute - это само собой разумеется. Просто они не меняют позицию элемента, а каким-то образом определяют сразу...

Ок, спасибо всем))


Часовой пояс GMT +3, время: 04:03.