浏览器也会加载HTML5后备图片

浏览器也会加载HTML5后备图片

本文介绍了即使支持HTML5视频,浏览器也会加载HTML5后备图片的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一些HTML5动画GIF动画作为后备广告。很遗憾,即使支持HTML5视频,也会加载GIF。

I have some HTML5 videos with animated GIFs as fallback. Sadly, the GIFs are being loaded even though HTML5 video is supported.

没有使用javascript,有没有办法阻止浏览器下载HTML5后备内容? 如果没有,我将只使用jquery,但想知道是否有非js解决方案。

Without using javascript, is there a way to stop the browser from downloading HTML5 fallback content? If not, I will just use jquery but wanted to know if there was a non-js solution.

<video>
  <source src="animation-1.mp4" type="video/mp4">
  <img src="animation-1.gif">
</video>
<video>
  <source src="animation-2.mp4" type="video/mp4">
  <img src="animation-2.gif">
</video>
<video>
  <source src="animation-3.mp4" type="video/mp4">
  <img src="animation-3.gif">
</video>

网络检查器显示Firefox(以及Chrome)肯定会下载GIF:

Network inspector shows that Firefox (and also Chrome) are definitely downloading the GIFs:

推荐答案

我从来没有找到答案,所以我只是改变 src data-src 在后备GIF上,如果检测到IE8或更早版本,我使用javascript将其更改回 src

I never found an answer to this, so I simply changed src to data-src on the fallback GIFs, and if IE8 or earlier was detected I changed it back to src using javascript.

这篇关于即使支持HTML5视频,浏览器也会加载HTML5后备图片的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-25 16:00