播放視頻插件swfobject.js與Video Html5


播放視頻的方法:

方法一、 使用HTML5播放


    <video src="./files/Clip_480_5sec_6mbps_h264.mp4" width="1000px" height="400px" controls="controls" loop="loop" autoplay="autoplay" poster="images/zzsm.png" style="border:1px solid red;">your browser does not support the video.</video>

poster用來設置視頻的封面圖,

loop是否循環播放

autoplay是否自動播放

controls是否顯示控制按鈕

缺點:兼容不太好
方法二:使用視頻插件swfobject.js 

首先下載下載所需要的文件,在demo.html中

 <!--video_1部分-->
    <div class="video_1" id="a1">
        <!--<img src="{$web_path}images/banner1.jpg" />-->
    </div>
    <script type="text/JavaScript" src="js/swfobjects.js"></script>
    <script type="text/javascript">
        var v = new SWFObject("files/flvplayer.swf", "single", "1100", "550", "1");
        v.addParam("allowfullscreen", "true");       //可以讓視頻撐滿限定的寬度和高度*
        v.addParam("wmode", "transparent");      //可以將視頻設置不為最高層,其他層可以覆蓋住視頻*
        v.addVariable('volume', '40');
        v.addVariable("autostart", 'false');
        v.addVariable("overstretch", "true");
        v.addVariable("file", "files/11.flv");//視頻路徑
        v.addVariable("image", "images/banner1.jpg");//設置視頻封面圖
        v.write("a1");
    </script>
    <!--end of video_1部分-->

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM