实例结构:

实例1: demo.html

<embed src="vcastr22.swf?vcastr_file=../wujiandao.flv" allowFullScreen="true" quality="high" type="application/x-shockwave-flash" width="640" height="320"></embed>

  

实例2: demo.html

<script type="text/javascript" src="flowplayer/flowplayer.min.js"></script>

<a style="display:block;width:640px;height:320px" id="player"></a>
<script>
flowplayer("player", "flowplayer/flowplayer.swf", {       //player是html中的id名---->修改处1
    clip: {
        autoPlay: false,                                  //是否自动播放
        autoBuffering: true,                              //是否在播放前显示画面
        baseUrl: ''                                       //基础地址,比如 http://www.meishichina.com/
    },
    playlist: [
        '../wujiandao.flv',                              //文件路径---->修改处2
        //'9483.mp4',                                     //下一个文件...
        {
            //url: "/media/empire.mp3",                   //非flv文件
            //duration: 25                                //持续时间
        }
    ],
    plugins: {
        controls: {
            url: 'flowplayer/flowplayer.controls.swf',    //播放器文件
            playlist: true,                               //是否支持播放列表
            backgroundColor: '#373737',                   //播放界面的背景色
            tooltips: {
                buttons: true,                            //全屏按钮
                fullscreen: '全屏'                        //全屏按钮的浮动提示文字
            }
        }
    },
    onFinish: function() {
        //alert("Click Player to start video again");       //播放完后的弹出提示文字
    }
});
</script>

<!--第二种方法: 最简的使用方法, 不需要设置参数.

<script type="text/javascript" src="flv/flowplayer.min.js"></script>
<a id="player" href='flv/wujiandao.flv' style="display:block;width:640px;height:320px" ></a>
<script>flowplayer("player", "flv/flowplayer.swf")</script>

-->

  

实例3: demo.html

<script type="text/javascript" src="jwplayer/jwplayer.js" ></script>
<div id="myElement">Loading the player...</div>
<script type="text/javascript">
    jwplayer("myElement").setup({
        file: "../wujiandao.flv",
        width: '640',
        height: '320',
        image: "",
        //skin: 'stormtrooper.zip'
    });
</script>

<!--

++++++++++++++++++++++++++++++++++++++++支持播放音频格式的文件
<script type="text/javascript" src="jwplayer/jwplayer.js" ></script>
<div id="myElement">Loading the player...</div>
<script type="text/javascript">
    jwplayer("myElement").setup({
        file: '/music/audio.mp3',
        controlbar: 'bottom'
    });
</script>

++++++++++++++++++++++++++++++++++++++++支持播放列表
<script type="text/javascript" src="jwplayer/jwplayer.js" ></script>
<div id="container"></div>
<script type="text/javascript">
    jwplayer("container").setup({
        'flashplayer': 'jwplayer.swf',
        'playlist': [{
            'file': '/videos/video1.mp4',
            'image': '/thumbs/video1.jpg',
            'title': 'The first video'
        },{
            'file': '/videos/video2.mp4',
            'image': '/thumbs/video2.jpg',
            'title': 'The second video'
        }],
        repeat: 'list'
    });
</script>

++++++++++++++++++++++++++++++++++++++++支持播放定位
<script type="text/javascript" src="jwplayer/jwplayer.js" ></script>
<div id="container"></div>
<script type="text/javascript">
  jwplayer("container").setup({
    file: "/videos/sintel.mp4",
    flashplayer: "/jwplayer/player.swf",
    height: 306,
    width: 720
  });
</script>
<ul>
  <li><a href="#" onclick="jwplayer().seek(0);">one</a> (00:00)</li>
  <li><a href="#" onclick="jwplayer().seek(106);">two</a> (01:46)</li>
</ul>

-->

 

;

js网页视频播放: vcastr22 、 flowplayer 、 jwplayer的更多相关文章

  1. Video.js网页视频播放插件

        插件描述:Video.js 是一个通用的在网页上嵌入视频播放器的 JS 库,Video.js 自动检测浏览器对 HTML5 的支持情况,如果不支持 HTML5 则自动使用 Flash 播放器. ...

  2. 建站技能get(1)— Asp.net MVC快速集成ckplayer网页视频播放器

    故事背景大概是这样的,我厂两年前给山西晋城人民政府做了一个门户网站(地址:http://jccq.cn/),运行了一年多固若金汤,duang的有一天市场部门过来说,新闻管理模块带视频的内容播放不了了. ...

  3. 7款Flash和Javascript网页视频播放器

    Flash和javascript网页视频播放器.梦想中的视频播放器是这样的: 支持所有格式,兼容所有主流视频网站,支持播放列表.视频缩略图.全屏播放.画面调节.预加载.体积贼小,功能贼多……. 也许你 ...

  4. js网页滚动条滚动事件实例分析

    本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...

  5. 支持wmv、mpg、mov、avi格式的网页视频播放代码

    这2天一直在整金网奖的相关项目,比较头大的就是网页视频播放了,需要考虑各种不同格式的视频,然后找相应的视频播放器. 这次使用了2种方法对这些视频进行处理: 1.使用ckplayer网页视频播放器 ck ...

  6. 酷播迷你flv,mp4网页视频播放器(CuPlayerMini)V2.2版[经典黑]演示实例

    酷播迷你flv,mp4网页视频播放器(CuPlayerMini)V2.2版[经典黑]演示实例 http://www.cuplayer.com/cu/FreeDown/

  7. js网页倒计时精确到秒级

    网页实时倒计时,精确到秒级,和天数倒计时原理一样. 一个很好用的js倒计时!网页实时倒计时,精确到秒级,和天数倒计时原理一样.js倒计时一般用于商城网站团购,特卖,很多地方都可用到!希望能够给大家带来 ...

  8. Node.js 网页爬虫再进阶,cheerio助力

    任务还是读取博文标题. 读取app2.js // 内置http模块,提供了http服务器和客户端功能 var http=require("http"); // cheerio模块, ...

  9. Node.js 网页瘸腿稍强点爬虫再体验

    这回爬虫走得好点了,每次正常读取文章数目总是一样的,但是有程序僵住了情况,不知什么原因. 代码如下: // 内置http模块,提供了http服务器和客户端功能 var http=require(&qu ...

随机推荐

  1. 命令行设置IE代理

    IE代理可以在注册表中设置,所以用DOS修改注册表,可以达到目的.方法一:注册表文件:REGEDIT4[HKEY_CURRENT_USER\Software\Microsoft\Windows\Cur ...

  2. Win7如何安装IIS来浏览ASP网站

    1 进入控制面板-->程序与功能-->点击左侧的"打开或关闭Windows功能"-->把"Internet信息服务"给勾上,点击"确 ...

  3. OpenCV入门笔记(三) 图片处理

    OpenCV中提供了非常多处理图片的强大函数,能够对非常多格式的图片 加特效.有点实现Photoshop里的工具的感觉. 以下先介绍一些简单和常见的特效. 二值化(Image Threshold) 參 ...

  4. 网络编程readn、writen和readline函数的编写

    readn   在Linux中,read的声明为: ssize_t read(int fd, void *buf, size_t count); 它的返回值有以下情形: 1.大于0,代表成功读取的字节 ...

  5. android实现免费短信验证

    代码地址如下:http://www.demodashi.com/demo/12541.html 前言 获取短信验证码的的第三方很多,今天介绍一个获取短信验证码的demo,它有以下优势 短信到达率几乎1 ...

  6. 【Lucene】Apache Lucene全文检索引擎架构之中文分词和高亮显示4

    前面总结的都是使用Lucene的标准分词器,这是针对英文的,但是中文的话就不顶用了,因为中文的语汇与英文是不同的,所以一般我们开发的时候,有中文的话肯定要使用中文分词了,这一篇博文主要介绍一下如何使用 ...

  7. iOS 最新公布app到AppStore全流程具体解释

    一.生成公布证书(证书的作用:类似于驾照,证明你的身份能够进行开发人员一些操作) 打开https://developer.apple.com 点击右上角开发人员中心 这里输入你付款过的Apple 帐号 ...

  8. HTML5 的四个亮点

    1.XDM  cross-document-messaging  跨文档消息传递. 2.原生拖放功能. 3.新媒体元素 audio.video. 4.历史状态管理.

  9. java web 通配符* ? $1 $2 $3

    匹配通配符 * 匹配0-n个字符,但不包括“/”.即,“*”只匹配一级目录或文件中的零个或多个字符. ** 匹配0-n个字符,包括“/”.即,“**”匹配多级目录或文件. ? 匹配0-1个字符,但不包 ...

  10. Atitit. 如何判断软件工程师 能力模型 程序员能力模型  项目经理能力模型

    Atitit. 如何判断软件工程师 能力模型 程序员能力模型  项目经理能力模型 这里能力模型的标准化是对工具的使用为基本 工具(ide,语言,类库,框架,软件) 第一步 ::可使用api 类库 框架 ...