页面播放视频

一、使用<embed>标签

 <div id="divPlay" Style="display:none;"></div>
document.getElementById("divPlay").style.display = "inline";
var str = "<embed id=\"embedFile\" src="+fileURL+" width=\"100%\" height=\"500px\">"; $("#divPlay").html(str);
document.getElementById("embedFile").stop();//关闭视频

注意:如果<embed>直接放在div,直接动态赋值document.getElementById("embedFile").src = fileURL,视频无法播放,只好在JS动态添加

<embed>在不同浏览器调用的播放器不同,暂停、关闭视频的方法可能不同

二、VLC插件页面播放器

1、安装VLC

2、

IE

<div id="vlc_div" style="width:100%;height:95%;">
       <object id="vlc" type='application/x-vlc-plugin' events='True'  
              classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab">
            <param id='mrlParam' name='mrl' value='http://127.0.0.1:1002/uploadfiles/conffile/6142fb24-7bde-442c-b83e-cb44c8943862/1234.mp4' />
            <param name='volume' value='50' />
            <param name='autoplay' value='true' />
            <param name='loop' value='false' />
            <param name='fullscreen' value='false' />
       </object>
</div>

非IE 

<!--[if !IE]><!-->
    <object type='application/x-vlc-plugin' id='vlc' events='True' width="720" height="540" pluginspage="http://www.videolan.org" codebase="http://downloads.videolan.org/pub/videolan/vlc-webplugins/2.0.6/npapi-vlc-2.0.6.tar.xz">
        <param name='mrl' value='rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp' />
        <param name='volume' value='50' />
        <param name='autoplay' value='true' />
        <param name='loop' value='false' />
        <param name='fullscreen' value='false' />
    </object>
<!--<![endif]-->

三、jwplayer插件播放

<div class="video" style="width: 100%;height: 100%;">
      <div id='obj' class='col-xs-12 no-padding'></div>
</div>

<script type="text/javascript" src="${ctx }/resources/mediaplayer/jwplayer.js"></script>

function Play(file, second) {
            var plist = [];
            //var _file = file.substr(file.indexOf(theFileManager) + theFileManager.length);
            //_file = _file.replace(/\\/g, "/");
            file = file.substr(0, file.indexOf('.mp4'));
            var file_ = "mp4|" + file.replace(/\\/g, "/");//"mp4,|" + file.replace(/\\/g, "/");
            var _player = jwplayer("mediaplayer").setup({
                "flashplayer": '@Url.Content("~/html/mediaplayer/awDIY.swf")',//'@Url.Content("~/Scripts/TopicDetail/awDIY.swf")',
                "volume": "100",
                "bufferLength": "0.1",
                "stretching": "exactfit",
                //"autostart": "true",
                "skin": '@Url.Content("~/html/mediaplayer/skin/modieus.zip")',//'@Url.Content("~/Scripts/TopicDetail/skin/modieus.zip")',
                "width": $('#playerdiv').width(),
                "height": 213,
                "file": file_,//vod + _file,
                'streamer': streamer
            });
            if (_player.getState() != 'PLAYING') {//若当前未播放,先启动播放器
                _player.play();//play和autostart不能同时使用
                setTimeout(function () { _player.seek(second); }, 500);
            }
            else {
                _player.seek(second);
            }
        }

猜你喜欢

转载自www.cnblogs.com/lijianda/p/9842299.html