Воспроизведите или замените изображение GIF на клике на jQuery и начните с начала
У меня есть сайт с изображениями на нем. Некоторые изображения являются анимированными изображениями GIF. Что я сделал, так это показал статическое изображение GIF, и при событии щелчка отображаются реальные изображения GIF.
Вот мой код:
JQuery
$(".theimage").click(function() {
$(this).addClass('hidden');
$(this).next().removeClass('hidden');
});
$(".theimage2").click(function() {
$(this).addClass('hidden');
$(this).prev().removeClass('hidden');
});
HTML
<img class="theimage" src="image_static.gif" alt=""/>
<img class="theimage2 hidden" src="image_animated.gif" alt=""/>
CSS
.hidden{
display:none !important;
}
Я изменяю класс предыдущего и следующего элементов, потому что у меня может быть более одного изображения GIF на одной странице, таким образом предотвращая действие для всех них.
Пока все хорошо, скрипт работает. На самом деле я пытаюсь добиться того, чтобы изображение в формате GIF всегда начиналось с самого начала. На данный момент это происходит только в первый раз. Затем, похоже, что он продолжает играть в фоновом режиме, а во время второго вызова он просто продолжает играть. Иногда даже зависает, я думаю, что-то связанное с кешем.
Итак, возможно ли перезагружать GIF-изображение при каждом его вызове? Я пытался с помощью
+ new Date().getTime()
но это, кажется, не имеет никакого эффекта при смене классов.
Есть идеи?