VPF::Хороший вертикальный скроллер

Рыжий

Дата 13.12.2009, 14:27 (ссылка)

(нет голосов)

Загрузка ...

Помешанный

Профиль
Группа: Завсегдатай
Сообщений: 1423
Регистрация: 19.9.2004

Репутация: нет
Всего: 20

Здравствуйте!
Задачу с вертикальным скроллером сначала решил на JavaScript без библиотек, вот что необходимо: http://igorryzhkov.com/misc/easy.html
Теперь хочу переписать его с использованием JQuery

Код


function scroller(){
//Берем первый вложенный див и поднимаем его:
    $("#content > .opt:first").animate({marginTop:"-22px"},1200);
//после поднятия (когда верхний див совсем спрячется):
    $("#content > .opt:first").queue(function () {
//убираем его сверху и вставляем в низ:
        $(this).remove().css("marginTop","5px").appendTo("#content");
        $(this).dequeue();
    });
    setTimeout("scroller()",35);
    }
    
    $(document).ready(function(){
    scroller();    
   });

html:

Код


<div id="content">
    <div id="one" class="opt">Hello world!</div>
    <div id="two" class="opt">Something here</div>
    <div id="three" class="opt">Anything</div>
</div>

Пример: http://igorryzhkov.com/misc/jq.html
Как видите первый пример работает без особых задержек, второй - задерживается в момент queue и setTimeout =(
Как сделать плавный скроллер?

Любитель

Дата 19.12.2009, 02:18 (ссылка)

(нет голосов)

Загрузка ...

Программист-романтик

Профиль
Группа: Комодератор
Сообщений: 3645
Регистрация: 21.5.2005
Где: Воронеж

Репутация: 1
Всего: 92

А почему не устраивает просто:

Код


function scroller(){
    $("#content > .opt:first").animate({marginTop:"-22px"}, 1200, function() {
        $(this).remove().css("marginTop","5px").appendTo("#content");
        scroller();
    });
}

А?

--------------------

http://oryolalex.mybrute.com

Рыжий

Дата 19.12.2009, 23:26 (ссылка)

(нет голосов)

Загрузка ...

Помешанный

Профиль
Группа: Завсегдатай
Сообщений: 1423
Регистрация: 19.9.2004

Репутация: нет
Всего: 20

Любитель, Большое спасибо! Проглядел, что в animate есть коллбек =(

Но это не решает мой вопрос, вот твой пример live: http://igorryzhkov.com/misc/jq_l.html При remove() и appendTo() тратится время, что все равно приводит к "зависанию" скроллера =(

Есть ли хоть какой-нибудь способ это обойти? Все еще используя JQuery? smile

Любитель

Дата 20.12.2009, 00:21 (ссылка)

(нет голосов)

Загрузка ...

Программист-романтик

Профиль
Группа: Комодератор
Сообщений: 3645
Регистрация: 21.5.2005
Где: Воронеж

Репутация: 1
Всего: 92

Хм. Я правильно понимаю, что ты хочешь после окончания предыдущей анимации паралельно запустить перестановку элемента с выставлением маржина и новый виток анимации? Тогда единственное, что приходит в голову - setTimeout(..., 0) на первый экшен.

--------------------

http://oryolalex.mybrute.com

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Применение библиотек \| Следующая тема »