首页 文章

更改移动设备的HTML5视频源

提问于
浏览 次
1

应该是一个容易回答的人希望，我正在制作的网站有我不想在手机上加载的视频 .

想知道是否有办法将小于800px宽度的屏幕的每个视频的来源更改为1kb的视频，但在桌面上它会播放完整的视频，

我不打算降低移动用户的质量，移动用户根本不会看到视频，因为它们被图像替换以节省数据 . 我想阻止视频在移动用户的后台加载，因为我不希望他们下载未包含在他们的网站版本中的视频，如果我无法阻止它们加载到800px以下那么是否有可能用1kbvideo替换该断点处的源作为一种保存移动数据的黑客攻击 .

<video autoplay loop id="video-background" muted plays-inline>
<source src="VIDEO/BG-VID.mp4" type="video/mp4"> 
<source src="VIDEO/1kb-vid.mp4" type="video/mp4"> 
</video>
html5 video

2 回答

  • 0

    移动用户可以轻松显示全高清视频，它只是设置为400px（或其他）的断点 . 这并不意味着它们没有HD分辨率，事实上许多移动设备具有更高的分辨率 . Youtube，Netflix，他们都在移动设备上加载高清 .

    不再支持源标记中的媒体查询，这只能在几年前实现 .

    人们不希望在移动设备上看到分辨率较低的视频，他们希望看到全分辨率视频（如果他们的带宽允许）

    这就是为什么实现这一点的唯一方法与Netflix或Youtube实现此类事情的方式相同：动态地将具有不同大小的视频发送到不同的带宽 . 这意味着它们在播放期间会发生变化，因此无法以固定的方式对其进行定义 .

    您的问题的解决方案是MPEG-Dash，这需要在服务器上进行一些工作，并且还需要对视频进行特定编码 . 由于这是一个非常大的主题，我将链接one (good?) tutorial，但如果您搜索MPEG-Dash，您可以找到更多信息 .

    回复于
  • 1

    这个javascript似乎是我想要的，

    $(document).ready(function(){
var screenWidth = $(window).width();
if (screenWidth < 800){
    $('video').removeAttr('autoplay');
} else {
$('video').attr('autoplay');
}
});
    回复于

相关问题