从加载禁用HTML 5视频

我有一个设置，根据当前天气情况显示背景视频，如下所示：http://pitfarmtennis.co.uk/cms/。从加载禁用HTML 5视频

有6个不同的视频，目前jQuery代码来决定哪些显示只是设置它们显示：无，这可悲意味着所有这些仍然加载。

这是目前正在某个视频播放jQuery的，在这种情况下，一个阳光明媚的视频：

/*Day-sun*/ 
    if((weather.code == "28")||(weather.code == "30")||(weather.code == "44")) { 
     $('.home-bg-sun').css("display","inline"); 
    }

一个解决方案，我曾尝试是将所有的SRC在HTML数据属性-src，然后改变相关的一个SRC火的视频，这没有奏效到今天为止，但我可能做错：

的jQuery：

/*Day-sun*/ 
    if((weather.code == "28")||(weather.code == "30")||(weather.code == "44")) { 
     $('.home-bg-sun').attr('src', $('.home-bg-sun').attr('data-src')); 
    }

HTML：

<div class="home-bg-sun"> 
    <video class="home-bg-sun-video" autoplay loop poster="wp-content/themes/eddiemachado-bones-9db85e4/library/images/home-bg-sun-first_frame.jpg"> 
     <source id="home-bg-sun-video-source" src="wp-content/themes/eddiemachado-bones-9db85e4/library/videos/home-bg-sun.webm" type="video/webm"> 
     <source id="home-bg-sun-video-source" src="wp-content/themes/eddiemachado-bones-9db85e4/library/videos/home-bg-sun.mp4" type="video/mp4"> 
    </video> 
</div>

任何帮助将不胜感激！

PS：我使用雅虎天气来获取天气状况。

来源

2015-09-04 hardanger

有视频元素上preload属性。
您可能需要尝试metadata或none的值。

但请注意，此属性仅仅是浏览器的提示，并不是强制遵循它。

来源

2015-09-04 11:26:45 Kaiido

谢谢@Kaiido。我试图测试这个，我添加这段代码试图让视频停止加载： $（“＃home-bg-sun-video-source”）。attr（“autoplay”，“false”）; （“＃home-bg-sun-video-source”）。attr（“preload”，“none”）; 但它不工作！视频仍然显示 - 我的jQuery不正确？ – hardanger

为什么不直接在html上设置它？ 'autoplay'默认设置为false，你不需要它。是的，你的代码是错误的，这些属性应该设置为视频元素（'$（“＃home-bg-sun-video”）'） – Kaiido

谢谢 - 这可以工作，但视频在自动播放和预加载关闭时仍然加载看来，他们只是不显示。因此，我尝试在“＃home-bg-sun-video-source”元素上设置src属性，但我似乎无法引用它！以这种方式设置src时，视频从不加载。请有任何想法吗？ – hardanger

你可以尝试删除从隐藏的视频“自动播放”属性，并重构你的超像：

来源

2015-09-04 10:54:12

感谢您的回复。我刚刚测试了您的解决方案，但不幸的是，视频仍在加载，他们只是不玩。我的目标是防止视频不必要的加载。 – hardanger

也许你应该尝试多个视频标签与单一来源对方？ –

对不起@ user5285659，请您详细说明一下吗？不明白你的意思。 – hardanger

从加载禁用HTML 5视频

回答

相关问题