Концептуальный вопрос jQuery - скольжение в новом контенте

Question

Я новичок в jquery и AJAX.Я пытаюсь изложить свою концепцию.Я максимально упросту вопрос.

У меня есть страница с некоторыми # данными, извлеченными из базы данных, и кнопкой «Далее».Когда следующая кнопка нажата, я хочу обновить #data новыми случайными данными из базы данных и так далее.Я хочу, чтобы эта новая #data скользила справа.Я не хочу обновлять всю страницу, я хочу, чтобы #data обновлялся с помощью AJAX.

Я получил большую часть этой работы, кроме скользящей части.Я не уверен концептуально, как справиться с этим.Многие примеры, которые я видел, содержат статические данные на странице, и эти данные скрыты от просмотра с помощью CSS, а затем jquery перемещает панель в представление с использованием .animate.

В моем случае данные не являютсяна странице я загружаю его с помощью функции загрузки.

Мой самый большой вопрос: куда мне загрузить новые данные?Я не могу загрузить его в существующий div #data, потому что тогда не было бы ползунка.Сделать пустой div в качестве заполнителя для загрузки, затем загрузить туда новые данные и вставить их?

Любая помощь будет полезна.

Спасибо

Answer 1

Если вы хотите придерживаться примеров, которые вы упоминаете в своем вопросе, тогда вы можете использовать функцию успеха, вставляя данные в HTML-файл, однако вам необходимо отформатировать его. Это может быть в div или таблице или как угодно. Сделайте этот html "display: none" для начала. Таким образом, он не сразу появляется для пользователя, но все еще живет в DOM. В этот момент вы можете думать, что html находится в том же «состоянии», в котором находятся ваши примеры, прежде чем они вызывают animate (представьте, что это статический контент на данном этапе). Так что единственное, что осталось сделать, это позвонить в анимацию.

Answer 2

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

Секунду, в этом примере есть несколько примеровкод, я найду ссылку.

Хорошо, документы для .animate () имеют несколько примеров, так что это место для начала.В основном, у вас есть div, и вы используете метод .animate() для периодического обновления CSS - который, конечно, включает в себя такие вещи, как размещение на странице.

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

И есть куча полезных руководств и примеров здесь , здесь , здесь и здесь .