jQuery Media Plugin 插件实现在线视频播放业务

jQuery Media 简介

  Jquery Media Plugin是一款页面内容嵌套多媒体的插件。支持的大部分的多媒体播放器和多媒体格式，比如：Flash, Quicktime, Windows Media Player, Real Player, MP3, Silverlight, PDF等等。

播放器	文件格式
Quicktime	aif,aiff,aac,au,bmp,gsm,mov,mid,midi,mpg,mpeg,mp4,m4a,psd,qt,qtif,qif,qti,snd,tif,tiff,wav,3g2,3pg
Flash	flv, mp3, swf
Windows Media   Player	asx, asf, avi, wma, wmv
Real Player	ra, ram, rm, rpm, rv, smi, smil
Silverlight	xaml
iframe	html, pdf

此插件会把转化为

从而嵌套多媒体内容。此插件像其它的Jquery插件一样 简单易用。

比如：

1、JS调用：

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

jQuery Media Plugin选项

jQuery Media Plugin包括了很多选项，这些选项控制着多媒体的一些行为（需要特殊设定的属性详见）。

其默认选项如下：

// global defautls; override as needed
$.fn.media.defaults = {
    standards:  false,      // use object tags only (no embeds for non-IE browsers)
    canUndo:    true,       // tells plugin to store the original markup so it can be reverted via: $(sel).mediaUndo()
    width:        400,
    height:        400,
    autoplay:    0,               // normalized cross-player setting
    bgColor:    '#ffffff',     // background color
    params:        { wmode: 'transparent'},    // added to object element as param elements; added to embed element as attrs
    attrs:        {},            // added to object and embed elements as attrs
    flvKeyName: 'file',     // key used for object src param (thanks to Andrea Ercolino)
    flashvars:    {},            // added to flash content as flashvars param/attr
    flashVersion:    '7',    // required flash version
    expressInstaller: null,    // src for express installer

    // default flash video and mp3 player (@see: http://jeroenwijering.com/?item=Flash_Media_Player)
    flvPlayer:     'mediaplayer.swf',
    mp3Player:     'mediaplayer.swf',

    // @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
    }
};

一个简单的Demo

    

        Watch my movie!</a> 

运行效果：

 
    

 也可使用下面浏览器生成的方法：