jQuery Media多媒体插件下载与个性化配置详解
来源:互联网 发布:动态图截取软件 编辑:程序博客网 时间:2024/04/30 18:11
jQuery Media多媒体插件下载与个性化配置详解
摘要: jQuery Media 插件及其使用详解,jQuery media Plugin 通过选项配置与个性化定制可以自动将页面上指向媒体文件的链接转成嵌入播放器的...
jQuery Media 插件及其使用详解,jQuery media Plugin 通过选项配置与个性化定制可以自动将页面上指向媒体文件的链接转成嵌入播放器的页面,还可以隐式地将标准的标记转变为富媒体内容,jQuery Media Plugin 多媒体插件,jquery 视频播放器,jquery media player ,jquery.media.js 。
jQuery media Plugin 可以用来在网页中嵌入几乎任何媒体格式,包含 Flash 、Quicktime 、Windows Media Player 、Real Player 、MP3 、Silverlight 、PDF 等,这个插件将元素转变为容纳用于渲染媒体内容的 object 、embed 甚至是 iframe 的 div 元素。
Media 媒体插件下载
jquery.media.js 下载
在网页中嵌入播放器
1、JS调用
以下为引用内容: $('.media').media();
2、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>
-
3、运行结果
jQuery media Plugin 在网页中嵌入媒体格式后运行结果
以下为引用内容: <div class="media"> <object codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"> <param name="src" value="sample.mov"> <embed src="sample.mov" pluginspage="http://www.apple.com/quicktime/download/"></embed> </object> <div>My Quicktime Movie</div> </div> <div class="media"> <object codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" type="application/x-oleobject"> <param name="src" value="sample.swf"> <embed src="sample.swf" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"></embed> </object> <div>My Flash Movie</div> </div><div class="media"> <object codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" type="application/x-oleobject"> <param name="url" value="sample.wma"> <embed src="sample.wma" type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"></embed> </object> <div>My Audio File</div> </div>
媒体插件选项配置
jQuery Media Plugin 包括很多选项,以控制多媒体的播放方式。
默认选项
以下为引用内容: // global defautls; override as needed $.fn.media.defaults = { preferMeta: 1, // true if markup metadata takes precedence over options object autoplay: 0, // normalized cross-player setting bgColor: '#ffffff', // background color params: {}, // added to object element as param elements; added to embed element as attrs attrs: {}, // added to object and embed elements as attrs flashvars: {}, // added to flash content as flashvars param/attr flashVersion: '7', // required flash version // default flash video and mp3 player // @see: http://jeroenwijering.com/?item=Flash_Media_Player flvPlayer: 'mediaplayer.swf', mp3Player: 'mediaplayer.swf',// Silverlight options // @see http://msdn2.microsoft.com/en-us/library/bb412401.aspx silverlight: { inplaceInstallPrompt: 'true', // display in-place install prompt? isWindowless: 'true', // windowless mode (false for wrapping markup) framerate: '24', // maximum framerate version: '0.9', // Silverlight version onError: null, // onError callback onLoad: null, // onLoad callback initParams: null, // object init params userContext: null // callback arg passed to the load callback } };
定制多媒体个性化展示方式
jQuery media Plugin 定制个性化多媒体展示方式
1、JS调用
以下为引用内容: $('.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 });
2、Html 代码
以下为引用内容: <a href="myMovie.mov" class="media">Watch my movie!</a>
3、运行结果
以下为引用内容: <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>
- jQuery Media多媒体插件下载与个性化配置详解
- jQuery media插件详解
- Flash Media Server下载与配置
- jQuery下载与配置
- HTML5无插件多媒体Media——音频audio与视频video
- jquery media 插件中的大坑
- 7款个性化jQuery/HTML5地图插件
- JQuery滚动插件EasySlider配置详解
- Uploadify(JQuery上传插件)使用配置详解
- Uploadify(JQuery上传插件)使用配置详解
- jQuery插件---datatables参数配置详解
- Android多媒体(Media)入门
- Android多媒体(Media)入门
- LinuxKernel多媒体media
- Android多媒体(Media)入门
- @media多媒体类型
- JRiver Media Center 23(多媒体播放工具)官方正式版64位V23.0.73下载 | jriver media center 破解版
- JRiver Media Center 23(多媒体播放工具)官方正式版64位V23.0.84下载 | jriver media center 破解版
- 在头文件里避免使用using namespace XXX
- 批量修改表的所有者
- 由浅入深探究mysql索引结构原理、性能分析与优化
- oracle中的正则表达式
- Oracle设置语录
- jQuery Media多媒体插件下载与个性化配置详解
- 从Web到移动应用的设计思维转换
- JVM调优总结(一)-- 一些概念
- 博客网址
- Android简单的发短信案例
- MVC学习
- [Leetcode] Partition List
- C#位运算 http://www.cnblogs.com/sweting/archive/2009/11/05/1596873.html
- JVM调优总结(二)-一些概念