我有一个div元素,它通过一个函数动态获取两个不同的动态gif。
然而,如果您尝试第二次点击,则不会显示动画,但您只会得到gif的最后一帧。
片段:https://jsfiddle.net/rickhaar/0keu6prx/40/ 是否有办法在保持base64格式的同时,在每次更改图像时重新启动动画?
<div style="width:100px; height:100px" id="img0" data-bind="style : {backgroundImage: img()}"></div>
<button data-bind="click: function(data, event) { changeImg(); }">SWITCH IMG</button>
当页面加载时,第一个动画gif会显示出来,当按钮被点击时,第二个动画也会正确地显示出来。
self.changeImg = function () {
self.imgIndex(!self.imgIndex());
};
self.img = function () {
if(self.imgIndex())
return "url(GIF1)";
else
return "url(GIF2)"
};
return self;
}
然而,如果您尝试第二次点击,则不会显示动画,但您只会得到gif的最后一帧。
片段:https://jsfiddle.net/rickhaar/0keu6prx/40/ 是否有办法在保持base64格式的同时,在每次更改图像时重新启动动画?