Первый jQuery .animate () не работает

0

Я очень новичок в jQuery, JavaScript и т.д. Я работал над попыткой получить пару анимаций:

В настоящее время у меня есть частичная рабочая демонстрация, расположенная здесь: http://jsbin.com/uwonun/64/

Благодаря jwags работает 2-й.animate().

Я пытаюсь реализовать тот же эффект анимации, чтобы я мог заменить.slideDown().

Моя последняя попытка получить его работу можно найти здесь: http://jsbin.com/OYebomEB/1/

Имейте в виду, что, продолжая работать над этим, код изменится.

function anim_loop(index) {
  $(elements[index]).css({top: 0, display: 'none'}).animate({top: -75},1000, function() {
    var $self = $(this);
    setTimeout(function() {
        $self.animate({top: $(window).height() + 10}, 1000);
        anim_loop((index + 1) % elements.length);
        }, 3000);
    });
}
  • 0
    так вы это скрываете, а потом оживляете? кажется, что ты никогда этого не увидишь ...
Теги:
animation

1 ответ

1
Лучший ответ

Вы устанавливаете display:none, но никогда не показываете его.

Используйте css('display','block') в setTimeout() перед animate():

setTimeout(function() {
    $self.css('display','block').animate({top: $(window).height() + 10}, 1000);
        anim_loop((index + 1) % elements.length);
    }, 3000);
});

Вы можете сделать его плавным, установив opacity:0 при инициализации и opacity:1 во втором animate() ;)

редактировать

Чтобы заставить первый цикл работать как другие, вы должны отображать свои элементы перед визуализацией на экране, установив display:block before animate():

function anim_loop(index) {
  $(elements[index]).css({top:-75, display: 'block'}).animate({top: '+0'},1000, function() {
        var $self = $(this);
        setTimeout(function() {
$self.animate({top: $(window).height() + 10}, 1000);
            anim_loop((index + 1) % elements.length);
        }, 3000);
    });
}
  • 0
    Спасибо за совет, мне удалось заставить его работать почти. Тем не менее, на первом цикле это не работает правильно. jsbin.com/OYebomEB/2 Это просто проходит без остановки
  • 0
    @ Рэгги Смотрите мой отредактированный ответ, это должно сработать!
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню