代码之家  ›  专栏  ›  技术社区  ›  user3882091

HTML5视频在使用结束功能时无法自动播放

  •  2
  • user3882091  · 技术社区  · 10 年前

    我的网站有HTML5视频背景。一旦播放完毕,它就会指向一个锚链接。

    这工作得很好,我唯一的问题是一旦我实现了指向锚定链接的功能,视频就会停止自动播放!?

    该网站基于FullPage.js

    下面是我的视频功能的代码:

    $(document).ready(function() {
            $('#fullpage').fullpage({
                verticalCentered: true,
                sectionsColor: ['#fff', '#fff', '#fff', '#fff', '#fff'],
                anchors: ['firstPage', 'secondPage', '3rdPage', '4thpage', 'lastPage'],
                menu: '#menu',
    
    
                afterRender: function(){
    
    
                    //playing the video
    
                    $("#myVideo").play().on("ended", function load() {
                        window.location.hash="secondPage"
                    });
                }
            });
        });
    

    这是视频中的代码加载。

    <video autoplay controls id="myVideo">
            <source src="intro.mp4" type="video/mp4">
        </video>
    

    我尝试使用autoplay=“autoplay”和各种变体,但没有运气(

    有什么建议吗?

    干杯

    2 回复  |  直到 10 年前
        1
  •  1
  •   Alvaro    10 年前

    您应该看看fullpage.js网站中的背景视频示例: http://alvarotrigo.com/fullPage/examples/videoBackground.html

        $(document).ready(function() {
            $('#fullpage').fullpage({
                verticalCentered: true,
                sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE'],
                afterRender: function(){
    
    
                    //playing the video
                    $('video').get(0).play();
                }
            });
        });
    
        2
  •  0
  •   user3882091    10 年前

    打碎了!

        document.getElementById("myVideo").play(); 
    $("#myVideo").on("ended", function load() { window.location.hash="secondPage"