0

我需要的是一个脚本,该脚本将触发页面上具有相同类的所有 html5 视频来播放——一旦页面被加载——因为 html5 自动播放属性是禁止的。

我是一个 JavaScript 菜鸟。我编写了下面的脚本来解决由于与 [skel.js] ( https://github.com/n33/skel.old ) 冲突而导致 html5 视频自动播放中断的问题。

我不能从头开始编写javascript,所以我对这个脚本中发生的事情一无所知;但是,它可以在我的网站上完成我需要它做的事情。但是,我敢打赌,它写得不好或效率低下。例如,我目前为每个视频/课程都有一个单独的脚本。我知道用同一类调用所有视频会更聪明,但我不知道如何。我很想知道这里是否有多余或错误的代码,以及是否有更好的解决方案让这些视频在页面加载时自动播放?

这是我正在使用的代码:

<script><!-- hack to fix html5 autoplay break when using skel.js-->
    startplaying();
    function startplaying(time) {
        var run = setInterval(function() { $('.video1')[0].play(); }, 2000);
    }
</script>

这是我的完整测试代码:

<!DOCTYPE HTML>
<html>
<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<script src="js/jquery.min.js"></script>
<script src="js/skel.min.js"></script>
<script src="js/skel-layers.min.js"></script>

</head>
<body>

<video class="video1" width="100%" controls loop><!-- can't use autoplay becuase of a bug!-->
    <source src="http://coldriverfurniture.com/_TEST/images/about-water-powered-tenoning-machine.mp4" type="video/mp4">
    <source src="http://coldriverfurniture.com/_TEST/images/about-water-powered-tenoning-machine.ogg" type="video/ogg">
    Your browser does not support this video.
</video>

<video class="video2" width="100%" controls loop><!-- can't use autoplay becuase of a bug!-->
    <source src="http://coldriverfurniture.com/_TEST/images/about-water-powered-tenoning-machine.mp4" type="video/mp4">
    <source src="http://coldriverfurniture.com/_TEST/images/about-water-powered-tenoning-machine.ogg" type="video/ogg">
    Your browser does not support this video.
</video>

<script><!-- hack to fix html5 autoplay break when using skel.js-->
    startplaying();
    function startplaying(time) {
        var run = setInterval(function() { $('.video1')[0].play(); }, 2000);
    }
</script>

<script>
    startplaying();
    function startplaying(time) {
        var run = setInterval(function() { $('.video2')[0].play(); }, 2000);
    }
</script>

<script src="js/init.js"></script>

</body>
</html>

谢谢!

4

0 回答 0