相关疑难解决方法(0)

我在img标签中有一个动画gif,我从重写src属性开始.但是,创建了gif循环,我只希望它播放一次.有没有办法,使用Javascript或jQuery,阻止动画gif不止一次播放？

我正在使用动画GIF创建动画幻灯片.我正在从一个动画到另一个动画交叉淡入淡出.问题是:我发现确保GIF从第一帧开始动画的唯一方法是每次显示它时重新加载它.每个GIF大约200KB左右,这对于连续幻灯片放映而言带宽太多.

这是我目前的代码.img并且nextimg是<div>包含<img>每个单独的标签.nextimg_img是与<img>要显示的下一个图像对应的标记.

var tmp = nextimg_img.attr('src');
nextimg_img.attr('src', '');
setTimeout(function() { nextimg_img.attr('src', tmp); }, 0);
img.fadeOut('slow');
nextimg.fadeIn('slow');

我们的想法是src将下一个图像的属性设置为'',然后将其设置回要显示的GIF源.

这有效 - 它从一开始就重新启动动画 - 但是每次显示GIF时都会重新加载.

编辑:这是一个循环幻灯片,我试图避免在他们显示第二个/第三个/后续时间时从网上重新加载GIF.

是否可以重新启动用作动画的GIF background-image？

考虑这个HTML:

<div id="face">
    <div id="eyes"></eyes>
</div>

而这种风格:

#eyes.blink {
    background-image:url('blink.gif');
}

我想在blink.gif动画播放每次我的类添加时间blink到#eyes,不只是第一次.

我希望这可行:

function startBlink() {
    $('#eyes').addClass('blink');
}

function stopBlink() {
    $('#eyes').removeClass('blink');
}

问题是Firefox和WebKit浏览器一旦播放一次就不再播放背景图像GIF动画.添加/删除类闪烁仅在第一次有效.

是否可以在不下载文件的情况下重新启动gif动画？我当前的代码如下所示:

var img = new Image();
img.src = 'imgages/src/myImage.gif';

$('#id').css('background-image', 'url("' + img.src + '?x=' + Date.now() + '")' );

编辑

当我将gif插入dom时,它没有重新启动gif动画.我只能通过在图像src中附加一个随机字符串来实现这一点,但这会再次下载图像.

我想知道是否可以在不下载gif的情况下重启gif动画.