0

画像付きのサイトがあります。画像の一部はアニメーションGIF画像です。私が行ったことは、GIF の静止画像を表示することであり、クリック イベントで実際の G​​IF 画像が表示されます。

これが私のコードです:

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;
}

1 つのページに複数の GIF 画像がある可能性があるため、前の要素と次の要素のクラスを変更しているため、それらすべてに対してアクションが発生しません。

これまでのところ、スクリプトはうまく機能しています。私が実際に達成しようとしているのは、GIF 画像が常に最初から開始されるようにすることです。現時点では、最初の 1 回だけです。その後、バックグラウンドで再生を続けているように見え、2 回目の呼び出しではそのまま再生を続けます。フリーズすることもありますが、キャッシュに関係していると思います。

それで、呼び出されるたびにGIF画像を再ロードすることは可能ですか? 使ってみた

+ new Date().getTime()

しかし、クラスチェンジ時には何の効果もないようです。

何か案は?

4

0 に答える 0