zoukankan      html  css  js  c++  java
  • html 手机端 解决部分手机无法自动播放音乐,视频自动播放

    1、音乐自动播放

    <section class="music rotate hide">
        <audio loop src="/static/diseasesGame/video/2.mp3" id="audio_play" autoplay preload></audio>
    </section>
    
    
    $('.music').show();
    
     var play = true;    document.addEventListener("WeixinJSBridgeReady",function(){$("#audio_play").get(0).play()});
            $('.music').on('click', function () {
                if (play) {
                    $('#audio_play')[0].pause();
                    $(this).removeClass('rotate');
                    play = false;
                } else {
                    $('#audio_play')[0].play();
                    $(this).addClass('rotate');
                    play = true;
                }
            });

    2、视频自动播放

    <video controls id="video2" autoplay  playsinline="playsinline"  x5-video-player-type="h5-page"
                   x5-video-player-fullscreen="true"   x5-playsinline="" x5-video-orientation="portraint" webkit-playsinline=""  >
                <source src="/static/diseasesGame/video/03.mp4?1" type="video/mp4">您的浏览器不支持 video 标签。
            </video>
    
    
    
        window.playVideo = function (videoId, cbVideoBegin, cbVideoEnd, cbVideoEnd1, time) {
            var _this = this, firstVisit = true, firstVisit1 = true;
            var media = document.getElementById(videoId);
            if(!isWeiXin()){
                enableInlineVideo(media);
            }
            media.currentTime = 0;
            media.play();
            lastMedia = media;
            wx.ready(function () {
                WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                    media.play();
                });
            });
    
            // $(media).off('timeupdate').on('timeupdate', function () {
            //     var currentTime = media.currentTime;
            //     var duration = media.duration;
         
            // });
    
            // $(media).on('ended', function () {
            //     if (firstVisit1 && typeof(cbVideoEnd1) === 'function') {
          
            //     }
            //
            // });
        };
    
    autoPlayVideo('video2');
  • 相关阅读:
    IDEA解决Cannot download sources的问题
    Swagger在Springboot项目中的使用
    ElasticSearch(10)—SpringBoot集成ES
    ElasticSearch(9)---Rest风格
    ElasticSearch(8)---IK分词器
    js显示原型和隐示原型
    通俗易懂讲解为什么设计稿都是750px
    关于rem和px全局设置问题
    PHP RSA密文过长加密解密 越过1024的解决代码
    使用https,$_SERVER['HTTPS']却不等于on?
  • 原文地址:https://www.cnblogs.com/-lin/p/12421051.html
Copyright © 2011-2022 走看看