destoon8.0移动端控制视频点击播放点击下一个视频时自动停止播放&监听滑动溢出屏幕高度时停止播放

  2021-03-09    阅读:170
 <script type="text/javascript">
            var go;//记录video播放器位置
            var video=document.querySelectorAll('video')//获取页面中所有video
            for(var i=0;i<video.length;i++) {
                (function (v) {
                    video[v].addEventListener('play',function(e){
                        if(go){
                            if(go!=this){
                                go.pause();//暂停播放
                                go.currentTime = 0;//跳转0秒
                            }
                        }
                        go = this;
                    });
                })(i);
            }
            $(window).scroll(function () {//监听滚动条
                if(go){
                    var top = go.getBoundingClientRect().top;//实时获取当前video距离窗口顶部
                    var bottom = go.getBoundingClientRect().bottom;//实时获取当前video距离窗口底部
                    if(bottom<0 || top>$(window).height()){//判断video是否在有效区域
                        go.pause();//暂停播放
                        go.currentTime = 0;//跳转0秒
                    }
                }
            });
        </script>

免责声明:
本站部份内容系网友自发上传与转载,不代表本网赞同其观点;
如涉及内容、版权等问题,请在30日内联系,我们将在第一时间删除内容!

相关Destoon技术

(c)2012-2023 www.qiyeyunshang.com All Rights Reserved.
慧一科技destoon模板   辽ICP备2021002520号-1
  QQ咨询

购买模板 售前咨询

  咨询QQ

3292628658
(早8:30-晚10:00)

  微信咨询

咨询微信
客服微信

  返回顶部