Auto-Scrolling Divs с JQuery (в Foursquare Feed) - PullRequest
6 голосов
/ 15 мая 2011

Поэтому я вызываю записи с помощью JQuery, когда страница загружается следующим образом:

$.ajax(
        {
            type: "POST",
            url: "<%= Url.Action("GetRecords", "Home") %>",
            data: sessioninfo,
            success: function(data){
                // data == the divs
              }
        });

Возвращаемое data может быть любым количеством <div> элементов (0 или более).

У меня также есть <div id="container"> на моей странице. Я хочу разместить сразу после вызова AJAX 8 элементов <div>, которые возвращаются из вызова в container, или столько, сколько их, если их меньше 8.

После этого, каждые 5 секунд (я могу сделать это, установив интервал в Javascript), я хочу показать следующий, высвободив самый нижний div из container, а следующий в список скользит наверх (аля Foursquare.com). Если больше нечего отображать, он сделает еще один AJAX-вызов, чтобы получить больше, а если будет доступно больше, то он выскочит снизу и снова выскочит сверху.

Вот мои основные вопросы.

Как я могу сделать эту анимацию с JQuery? Кроме того, где я должен хранить элементы <div>, которые изначально не помещаются (если возвращается более 8)? Я предполагаю, что это также будет место для хранения тех, которые возвращаются после второго AJAX-вызова, если мне нужно сделать вызов для большего.

EDIT : Самая нижняя часть <div> должна выскользнуть из container только в том случае, если она не полностью умещается, в противном случае она должна просто скользить вниз. Это произойдет, если в container.

меньше 8 <div> элементов.

Спасибо, ребята!

1 Ответ

3 голосов
/ 18 мая 2011

Является ли этим , что вы пытаетесь достичь?

, если это так, просто следуйте учебнику

...