player视频.js

最新推荐文章于 2024-05-02 18:12:22 发布

weixin_34015336

最新推荐文章于 2024-05-02 18:12:22 发布

阅读量1.4k

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xiao-zhi/p/9970840.html

版权

var playStatus = 'pending';
var html_a = '<div class="weui-dialog__bd" id="lly_dialog_msg" style="font-size: 12px;"><br><b style="font-size: 16px;color: red"></b><br><br><span style="font-size:20px;">精彩内容，即将呈现</span><b style="color: red;"></b></div>';
var dianji_a = "<a href='javascript:ap_a();'>立即播放</a>";

$(function() {

     wxalert(html_a, dianji_a)

     <script>
    var video = new tvp.VideoInfo();  //初始化视频对象
    video.setVid(vid);                //向视频对象传入视频vid ，这个是点播的时候使用
    //video.setChannelId(cnlid);      //向视频对象传入直播频道cnlid ，这个是直播的时候使用

    /*点播跟直播的区别主要是：
        点播是通过video.setVid(vid); 
        而直播是通过video.setChannelId(cnlid); 设置直播id
        $("video").trigger("play"); //自动点击触发播放
        点播需要player.addParam('type','2');或者省略，因为默认播放器为点播状态;
        直播必须通过player.addParam('type','1');设置播放器为直播状态，。
        audioEl.load(); // iOS 9   还需要额外的 load 一下, 否则直接 play 无效
         audioEl.play(); // iOS 7/8 仅需要 play 一下
    */
    
    var player = new tvp.Player(width, height);  //初始化播放器对象并设置宽、高
    player.setCurVideo(video);                   //设置播放器初始化时加载的视频
    player.addParam('type','1');                 //设置播放器为直播状态，1表示直播，2表示点播，默认为2
    player.addParam("wmode","transparent");      //设置透明化，不设置时，视频为最高级，总是处于页面的最上面，此时设置z-index无效
    player.addParam('autoplay',false);           //是否自动播放
    player.addParam('pic','');                   //播放器默认图，当autoplay=0时有效；不传入则使用视频截图                                  
    player.addParam('showend',0)                 //结束时是否有广告
    player.addParam("flashskin", "http://imgcache.qq.com/minivideo_v1/vd/res/skins/TencentPlayerMiniSkin.swf"); //flash播放器精简皮肤；不传入则使用默认皮肤
    player.addParam("loadingswf", "http://imgcache.qq.com/minivideo_v1/vd/res/skins/web_small_loading.swf");   //加载视频时的swf动画; 不传入则使用默认样式
    player.write(DOMid);                         //输出播放器
    //events
    player.onplaying = function(vid) {
        console.log(vid);
    }
    player.onended = function(vid) {
        console.log(vid);
    }


  <video id="minione-video" class="minione-video" poster="./common/images/mini-one/miniONE_BG2.jpg" autoplay="autoplay" muted="muted" preload>
        <source type="video/mp4" src="http://c1.mifile.cn/f/i/16/chain/airpro/airpro-top.mp4">
        <!--<source type="video/mp4" src="./common/images/mini-one/mini-one-video.mp4">-->
        <!--<source type="video/mp4" src="./common/images/mini-one/mini-one-video.Ogg">-->
        <img src="./common/images/mini-one/BG2.jpg" alt="one">

      </video>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>Fake auto play html audio in iOS Safari the right way</title>
    <style>
        video{
            width: 100%;
        }
    </style>
</head>
<body>
<video id="bgmusic" autoplay preload muted>
    <source type="video/mp4" src="http://c1.mifile.cn/f/i/16/chain/airpro/airpro-top.mp4">
</video>
<script>
    (function() {
        function log(info) {
            console.log(info);
            // alert(info);
        }
        function forceSafariPlayAudio() {
            audioEl.load(); // iOS 9   还需要额外的 load 一下, 否则直接 play 无效
            audioEl.play(); // iOS 7/8 仅需要 play 一下
        }


        var audioEl = document.getElementById('bgmusic');


        // 可以自动播放时正确的事件顺序是
        // loadstart
        // loadedmetadata
        // loadeddata
        // canplay
        // play
        // playing
        // 
        // 不能自动播放时触发的事件是
        // iPhone5  iOS 7.0.6 loadstart
        // iPhone6s iOS 9.1   loadstart -> loadedmetadata -> loadeddata -> canplay
        // audioEl.addEventListener('loadstart', function() {
        //     log('loadstart');
        // }, false);
        // audioEl.addEventListener('loadeddata', function() {
        //     log('loadeddata');
        // }, false);
        // audioEl.addEventListener('loadedmetadata', function() {
        //     log('loadedmetadata');
        // }, false);
        // audioEl.addEventListener('canplay', function() {
        //     log('canplay');
        // }, false);
        // audioEl.addEventListener('play', function() {
        //     log('play');
        //     // 当 audio 能够播放后, 移除这个事件
        //     window.removeEventListener('touchstart', forceSafariPlayAudio, false);
        // }, false);
        // audioEl.addEventListener('playing', function() {
        //     log('playing');
        // }, false);
        // audioEl.addEventListener('pause', function() {
        //     log('pause');
        // }, false);


        // 由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio,
        // 因此我们通过一个用户交互事件来主动 play 一下 audio.
        window.addEventListener('ready', forceSafariPlayAudio, false);
        // audioEl.src = 'http://c1.mifile.cn/f/i/16/chain/airpro/airpro-top.mp4';
    })();
</script>
</body>
</html>

转载于:https://www.cnblogs.com/xiao-zhi/p/9970840.html

weixin_34015336

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
player视频.js

var playStatus = 'pending';var html_a = '<div class="weui-dialog__bd" id="lly_dialog_msg" style="font-size: 12px;"><br><b style="font-size: 16px;color: red"></b><br>&...
复制链接

扫一扫