Анимированный gif, начинающийся с прокрутки

#jquery #css #animation #gif #animated-gif

#jquery #css #Анимация #gif #анимированный-gif

Вопрос:

Я создал 4 анимированных GIF-файла и хочу, чтобы они начинались с прокрутки пользователя.

Что я сделал, так это использовал это:

 $(function () {
    var screen = $(".screen");
    $(window).scroll(function () {
        var scroll = $(window).scrollTop();

        if (scroll >= 1500) {
            screen.css('display','block');
        } else {
            screen.css('display','none');
        }
    });
});

Я попытался отобразить none и заблокировать GIF-файлы с помощью прокрутки, и это работает хорошо, проблема в том, что gif не начинается с начала, когда я блокирую его, он начинается где-то в середине анимации.

как я могу заставить gif начинаться точно с первого кадра, когда я его блокирую?

Большое спасибо!

1. Вы не можете «перезапустить» gif, если не будете каждый раз повторно извлекать его с сервера (вы этого не хотите). Одним из решений было бы использовать data-uri и повторно применить src .

Ответ №1:

Ваш код скрывает и показывает изображения, но не перезагружает изображение. Вместо этого вы должны обновить свой атрибут src или просто изменить то же изображение.

 $(this).attr("src",$(this).attr("src"))

One simple solution would be 

if (scroll >= 1500) {
   screen.attr('src',screen.attr('src')); // update its src, this reloads the img
} else {
   screen.css('display','none');
}