Плавно измененять порядкок следования блоков, загруженных по AJAX?

Question

[Amoled]

Добрый день.

Раз в 15 секунд с сервера получаем список-голосование в JSON-формате, после чего формируем его HTML-представление через jquery-tmpl, и вставляем содержимое в блок .list через jquery .html().
Выглядит примерно так список (от 0 до 30 пунктов):

<div class="list">
   <div class="item" data-id="3193"> ... </div>
   ...
   <div class="item" data-id="674"> ... </div>
</div>

Не подскажете способ сделать изменение списка плавным? Этот realtime-голосование, многие пользователи следят за своими позициями в списке, и когда он резко меняется при перегрузке (например когда с последней позиции на первую перескакивает кто-то), то это не ахти как здорово смотрится.

В идеале хотелось бы какой-то плагин, который смог бы отслеживать изменения списка от предыдущей итерации, и сам с эффектами что-то плавно скрывать, что-то плавно переставлять местами, без передергивания всего списка.

Спасибо.

Answer 1

[IceJOKER]

подгружаете новые данные в hide режиме(что умничать-то, просто новые данные скрываете), а далее просто используете jquery штучки для плавного появления (fade, slide и т.п. хрень).

Comments

[Amoled]

Нет никаких "новых" и "старых" данных, есть один и те же данные, которые периодически немного меняются, и эти изменения нужно плавно на странице воспроизводить. Ваш вариант ничем не отличается от простой замены html, как сделано уже сейчас, только с fade (который, стоит отметить, еще и лагает безбожно браузер в больших списках).

[IceJOKER]

Amoled: как нет старых и новых данных когда раз в 15 секунд данные обновляются?? либо старые данные должны исчезнуть и на их место вставляться данные, либо "старые" данные остаются и добавляются еще данные - так или иначе мой способ подходит под оба варианта.
-для первого варианта - старые данные удаляем, новые добавляем в скрытом режиме , а потом используем эффекты jquery для плавного появляения
-для второго варианта - те данные которые добавляются сначала скрываем, а после добавления плавно показываем

[Amoled]

IceJOKER: Вы что не понимаете, что так будет эпилепсия у тех, кто будет за этим наблюдать, еще и раз в 15 секунд?
Скрыть старые данные и показать новые любым способом - это та же самая простая замена. Вы хоть 25 разных эффектов туда прикрутить, все равно лучше оно от этого смотреться не будет.

Я спрашивал в принципе конкретно - нужна какая-то библиотека, которая сможет отследить изменения списка и сама плавно что-то скрыть, что-то плавно поменять местами.

[IceJOKER]

Amoled: вот нашел на stackoverflow - jsfiddle.net/JXLGR , адаптируйте под свой вариант. вроде принцип использованный там подходит и под ваш вариант

Answer 2

[frees2]

).hide().fadeIn(1000);

Comments

[Amoled]

Такой вариант подходит только для добавления новых данных.