重新加载动画 Gif 缓存每个 jQuery 悬停 [英] Reload Animated Gif cache each jQuery hover
问题描述
不同于:从 JavaScript 重新启动动画 GIF无需重新加载图像
我有一个简单的动画 gif 图标,可以播放一次(它不会重复循环)
我把它放在一个 DIV 里.当用户将鼠标悬停在 DIV 上时,我想播放 GIF.当他们搬出时,DIV 关闭.当移动回来时,我希望他们再次播放 GIF - 我可以在 jQuery 上使用强制缓存吗:
HTML:
<img id="magicimage_1" class="magicimg" src="assets/img/dates/gifpicture.gif" alt=""/>
jQuery:
$("#date_1").hover(function () {$("#magicimage_1").show();}, 功能 () {$("#magicimage_1").hide();});//考虑过这些/*var myImg = new Image();myImg.src = "image.gif?rnd=" + Math.random();img src="filename.gif?rand=<#?=rand(1,1000);?>"alt=""*/
我更新了旧代码以显示重置的图像.它应该很快,因为它已经缓存了.
所以新代码将是:
$("#date_1").hover(function () {//$("#magicimage_1").show();$("#magicimage_1").show().attr('src', 'assets/img/dates/1_randomhash-aefgh.gif?rnd='+Math.random()+'');}, 功能 () {//$("#magicimage_1").hide();$("#magicimage_1").hide().attr('src', '');});
因为我想在悬停时移除 SRC ......所以它可以完全播放
Different to: Restart an animated GIF from JavaScript without reloading the image
I have a simple animated gif icon which plays once (it does not repeat loop)
I have it inside a DIV. When the user mouse the mouse over the DIV I want to play the GIF. When they move out the DIV turns off. When the move back I want them to play the GIF again - can I use a force cache on jQuery:
HTML:
<div class="datebox magicbox_1" id="date_1">
<img id="magicimage_1" class="magicimg" src="assets/img/dates/gifpicture.gif" alt=""/>
</div>
jQuery:
$("#date_1").hover(function () {
$("#magicimage_1").show();
}, function () {
$("#magicimage_1").hide();
});
// thought about these
/*
var myImg = new Image();
myImg.src = "image.gif?rnd=" + Math.random();
img src="filename.gif?rand=<#?=rand(1,1000);?>" alt=""
*/
I updated the old code to show the images reset. It should be fast since it's already cached.
So the new code would be:
$("#date_1").hover(function () {
//$("#magicimage_1").show();
$("#magicimage_1").show().attr('src', 'assets/img/dates/1_randomhash-aefgh.gif?rnd=' +Math.random()+'');
}, function () {
//$("#magicimage_1").hide();
$("#magicimage_1").hide().attr('src', '');
});
As I want to remove the SRC on hover out.. so it plays fully
这篇关于重新加载动画 Gif 缓存每个 jQuery 悬停的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!