zoukankan      html  css  js  c++  java
  • 如何让音频跟视频在ios跟android上自动播放

    如何让音频跟视频在ios跟android上自动播放

    <audio autoplay ><source  src="audio/alarm1.mp3" type="audio/mpeg"></audio>
    

    系统默认情况下 audio的autoplay属性是无法生效的,这也是手机为节省用户流量做的考虑。 如果必须要自动播放,有两种方式可以解决。

    1.捕捉一次用户输入后,让音频加载,下次即可播放。

    //play and pause it once
    document.addEventListener('touchstart', function () {
        document.getElementsByTagName('audio')[0].play();
        document.getElementsByTagName('audio')[0].pause();
    });
    

    这种方法需要捕获一次用户的点击事件来促使音频跟视频加载。当加载后,你就可以用javascript控制音频的播放了,如调用audio.play()

    2.利用iframe加载资源

    var ifr=document.createElement("iframe");
    ifr.setAttribute('src', "http://mysite.com/myvideo.mp4");
    ifr.setAttribute('width', '1px');
    ifr.setAttribute('height', '1px');
    ifr.setAttribute('scrolling', 'no');
    ifr.style.border="0px";
    document.body.appendChild(ifr);
    

    这种方式其实跟第一种原理是一样的。当资源加载了你就可以控制播放了,但是这里使用iframe来加载,相当于直接触发资源加载。 注意,使用创建audio标签并让其加载的方式是不可行的。 慎用这种方法,会对用户造成很糟糕的影响。。

    转自https://github.com/jtyjty99999/mobileTech

  • 相关阅读:
    06HTML和CSS知识点总结(六)
    05HTML和CSS知识点总结(五)
    webpack警告解除(WARNING in configuration The 'mode' option has not been set)
    如何Altium Designer AD输出元件清单及按照不同数值分类
    M57962
    艾科 驱动电路分析
    矢量旋度的散度恒为零
    迟滞比较器
    与非门SR锁存器
    寄存器与锁存器的区别
  • 原文地址:https://www.cnblogs.com/liuwenbohhh/p/4465110.html
Copyright © 2011-2022 走看看