Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Плавное добавление элементов по тайм-ауту (https://javascript.ru/forum/events/37470-plavnoe-dobavlenie-ehlementov-po-tajjm-autu.html)

realstranger 21.04.2013 00:50

Плавное добавление элементов по тайм-ауту
 
Есть json вот такого вида:

{
    "weather": {
        "temp": {
            "min": "14",
            "max": "14"
        },
        "utime": 1366480800,
        "img": "w12",
        "valid": "2013-04-20T22:00:00"
    },
    "datetime": {
        "time": "00:43",
        "day": "сегодня"
    },
    "items": [{
        "text": "message1",
        "id": "111",
        "author": {
            "screen": "Name1",
            "avatar": "img1.jpg",
            "name": "Fio1"
        },
        "type": "rss",
        "datetime": {
            "time": "11:00",
            "day": "18 Апреля"
        }
    },
    {
        "text": "message2",
        "id": "222",
        "author": {
            "screen": "Name2",
            "avatar": "img2.jpg",
            "name": "Fio2"
        },
        "type": "tw",
        "datetime": {
            "time": "10:40",
            "day": "18 Апреля"
        }
    }]
}


В этот файл попадает по 6 последних сообщений, то есть длина items всегда 6. Сам файл обновляется моментально, в скрипте тайм-аут стоит 20 секунд.

Вопрос, как грамотно сделать обновление ленты, чтобы старые сообщения съезжали вниз, а новые появлялись сверху по fadeIn?

То есть первоначально нужна проверка и сравнение того, что есть уже, и того, что есть в файле. Перерисовывать весь блок не вариант.

Новые элементы, это li, которые пишутся prepend в определённый ul.

Куда копать?
Заранее, спасибо!

bret 22.04.2013 14:09

Вы правильно рассуждаете. Какие проблемы в реализации?


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