zoukankan      html  css  js  c++  java
  • 播放视频插件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部分-->
    
    

      

  • 相关阅读:
    每周总结
    4月9日学习日志
    4月8日学习日志
    4月7日学习日志
    4月6日学习日志
    Cypress存取时间为10纳秒的异步SRAM
    超低功耗MCU如何降低功耗
    集成铁电存储器MCU为物联网应用提供出色性能
    读取优先和SRAM-MRAM混合结构
    磁阻式随机存储器MRAM基本原理
  • 原文地址:https://www.cnblogs.com/qinglin/p/7149681.html
Copyright © 2011-2022 走看看