• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > jQuery多媒体插件jQuery Media Plugin使用详解

jQuery多媒体插件jQuery Media Plugin使用详解

作者: 字体:[增加 减小] 来源:互联网

通过本文主要向大家介绍了jQuery,Media,Plugin等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

jQuery Media Plugin是一款基于jQuery的网页媒体播放器插件,它支持大部分的网络多媒体播放器和多媒体格式,比如:Flash, Windows Media Player, Real Player, Quicktime, MP3,Silverlight, PDF。它根据当前的脚本配置,自动将a标签替换成div,并生成object, embed甚至是iframe代码,至于生成object还是embed,jQuery Media会根据当前平台自动判别,因此兼容性方面非常出色。下面这段代码是jQuery Media生成后的结果:

 <div class="media">
    <object width="450" height="250" attr1="attrValue1" attr2="attrValue2"
        codebase="http://www.apple.com/qtactivex/qtplugin.cab"
        classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B">
        <param name="src"      value="myBetterMovie.mov">
        <param name="autoplay" value="true">
        <param name="param1"   value="paramValue1">
        <param name="param2"   value="paramValue2">
        <embed width="450" height="250" src="myBetterMovie.mov" autoplay="true"
            attr1="attrValue1" attr2="attrValue2" param1="paramValue1" param2="paramValue2"
            pluginspage="http://www.apple.com/quicktime/download/" > </embed>
    </object>
</div>

具体使用方法

html标记代码

<a class="media" href="sample.mov">My Quicktime Movie</a>
<a class="media" href="sample.swf">My Flash Movie</a>
<a class="media" href="sample.wma">My Audio File</a>

初始化脚本:

$('.media').media();

选项

可以通过脚本对象或者jQuery Metadata Plugin来配置参数。

全局默认值:

$.fn.media.defaults = {
preferMeta: 1, // 如果为true, 则标记的meta值优先于脚本对象
autoplay: 0, // 标准化的跨播放器设置
bgColor: '#ffffff', // 背景颜色
params: {}, // 作为param元素添加到object标记中;作为属性添加到embed标记中
attrs: {}, // 作为属性添加到object以及embed中
flashvars: {}, // 作为flashvars参数或属性添加到flash中
flashVersion: '7', // 需要的最低flash版本
// 默认的flash视频和mp3播放器 // @see: http://jeroenwijering.com/?item=Flash_Media_Player
flvPlayer: 'mediaplayer.swf',
mp3Player: 'mediaplayer.swf',
// Silverlight选项 // @see http://msdn2.microsoft.com/en-us/library/bb412401.aspx
silverlight: {
  inplaceInstallPrompt: 'true', // 在适当的位置显示安装提示
  isWindowless: 'true', // 无窗口模式
  framerate: '24', // 最大帧速率
  version: '0.9', // Silverlight版本 onError: null, // onError回调函数
  onLoad: null, // onLoad回调函数
  initParams: null, // 对象初始化参数
  userContext: null // 传到load回调函数的参数
  }
};

我们也可以在执行初始化脚本的时候传入一些option参数进去,如下代码:

$('.media').media( { width: 400, height: 300, autoplay: true } );

再如代码:

$('.media').media({
  width: 450,
  height: 250,
  autoplay: true,
  src: 'myBetterMovie.mov',
  attrs: { attr1: 'attrValue1', attr2: 'attrValue2' }, // object/embed attrs
  params: { param1: 'paramValue1', param2: 'paramValue2' }, // object params/embed attrs
  caption: false // supress caption text
});

'src'选项

src选项指定了媒体文件的地址。它没有全局的默认值。如果未显示指定src选项的值,jQuery Media Plugin将使用href或者src属性的值来代替。

播放器和格式

jQuery Media Plugin默认为播放器和格式如下表所示:

播放器

文件格式

Quicktime

aif,aiff,aac,au,bmp,gsm,mov,mid, midi,mpg,mpeg,mp4,m4a,psd

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 基于jQuery对象和DOM对象和字符串之间的转化实例
  • jquery+css实现简单的图片轮播效果
  • 使用jQuery实现鼠标点击左右按钮滑动切换
  • jQuery实现上传图片前预览效果功能
  • jQuery初级教程之网站品牌列表效果
  • 基于jquery实现多选下拉列表
  • jQuery接受后台传递的List的实例详解
  • 详解jquery选择器的原理
  • jQuery上传插件webupload使用方法
  • 关于jquery form表单序列化的注意事项详解

相关文章

  • jquery获取一组checkbox的值(实例代码)
  • 获取select的value、text值的简单示例(jquery与javascript)
  • 转自Jquery官方 jQuery1.1.3发布,速度提升800%,体积保持20K
  • jquery 结合C#后台的数组对文章的关键字自动添加链接的代码
  • jquery ajax例子返回值详解
  • AJAX的跨域与JSONP(为文章自动添加短址的功能)
  • CSS+Jquery实现页面圆角框方法大全
  • jQuery validate验证插件使用详解
  • 实例讲解jQuery中对事件的命名空间的运用
  • jQuery实现加入收藏夹功能(主流浏览器兼职)

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 基于jQuery实现动态搜索显示功能
    • jQuery easyUI datagrid 增加求和统计行的实现代码
    • 锋利的jQuery jQuery中的DOM操作
    • 基于jquery的一个浮动框(扩展性比较好 )
    • 简单几步实现返回顶部效果
    • jQuery 插件封装的方法
    • jQuery入门知识简介
    • 用jquery模仿的a的title属性的例子
    • jquery实现跳到底部,回到顶部效果的简单实例(类似锚)
    • jquery对dom的操作常用方法整理

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有