五维工作室

这里是你们可以实现梦想的地方

标签 gif空白 下的文章

完美解决gif只播放一次的问题,完美解决gif空白问题

有一些浏览器 比如360极速浏览器,gif在上面只能播放一次,然后gif图片就会变成一片空白
这里首先需要判断一下浏览器的类型:

$.browser.webkit = /webkit/i.test(navigator.userAgent.toLowerCase());
function isB360(option, value) {
var mimeTypes = navigator.mimeTypes;
for (var mt in mimeTypes) {
  if (mimeTypes[mt][option] == value) {
    return true;
  }
}
return false;
}
$.browser.b360 = isB360("type", "application/vnd.chromium.remoting-viewer");

这里我使用的是rebox 插件,找得到对应的 img获取位置,通过 重置 img的src 为原src加上一个
随机数,可以重新加载gif图片,就可以重新播放了,但是也有缺点,就是 gif不能使用浏览器缓存

if(/(.gif)$/i.test($img[0].src) && $.browser.b360 && $.browser.webkit) {
    $img[0].src = ($img[0].src.split('?'))[0] + '?' + Math.random();
}

具体效果见:www.tipsns.com/read/23.html
gif只播放一次.png

其他的方法比如click点击获取到图片的dom对象之后,修改src刷新图片,效果也是一样的。

阅读全文