JQuery: Как Gowalla работает, это - эффект “слайда”?

Метко названный slideDown () .

В jQuery вы можете просто использовать slideDown , чтобы сделать что-то подобное, однако Gowalla, похоже, использует немного другой метод:

Отдельные панели находятся внутри родительской панели, которая периодически меняет свое положение. То есть сами панели не анимируются, и ничто даже не меняет размер: все панели просто перемещаются через область просмотра. Когда он достигает дна, страница Gowalla просто останавливается - на самом деле она загружает достаточно панелей примерно на 4 минуты скольжения - хотя в вашем случае вы можете снять панели внизу и подтолкнуть их обратно вверху, чтобы сделать его непрерывным. .

Я думаю, то, что они делают, похоже на то, что упомянул nickf. Для создания эффекта анимации, я думаю, все, что делается, это анимировать положение контейнера div, который оборачивается вокруг панелей внутри.

Таким образом, родительская панель будет иметь область просмотра, в которой помещается только 6 панелей. Другой контейнер div обернется вокруг всех панелей. Используйте jQuery .animate() для сдвига атрибута верхней позиции div. Каждая итерация будет смещать контейнер div вниз на высоту панели (например, на 100px).

var numPanels = 20;
var i = 1;

var livePanel = setInterval(function() {
  if (i < numPanels) {
    $('div.wrap').animate({'top': '+100px'}, 500, 'swing');
    i++;
  } else {
    livePanel.clearInterval();
  }
}, 1000);

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