Penjelasan terperinci tentang jQuery multimedia plug-in jQuery Media Plugin_jquery

JQuery Media Plugin ialah pemalam pemain media web berdasarkan jQuery Ia menyokong kebanyakan pemain multimedia dalam talian dan format multimedia, seperti: Flash, Windows Media Player, Real Player, Quicktime, MP3, Silverlight, PDF. Ia secara automatik menggantikan teg dengan div berdasarkan konfigurasi skrip semasa, dan menjana objek, benam dan juga kod iframe Bagi sama ada untuk menjana objek atau benam, jQuery Media akan secara automatik menentukan berdasarkan platform semasa, jadi keserasian adalah. cemerlang. Kod berikut ialah hasil yang dijana oleh jQuery Media:

Salin kod Kod adalah seperti berikut:

<div class="media">
<lebar objek="450" ​​​​height="250" attr1="attrValue1" attr2="attrValue2"
         codebase="http://www.apple.com/qtactivex/qtplugin.cab"
classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B">                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  <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> </objek> </div>


Penggunaan khusus


kod penanda html

Salin kod

Kod adalah seperti berikut:

<a class="media" href="sample.mov">Filem Quicktime Saya</a> <a class="media" href="sample.swf">Filem Flash Saya</a> <a class="media" href="sample.wma">Fail Audio Saya</a>

Skrip permulaan:

Salin kod

Kod adalah seperti berikut:

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

Parameter boleh dikonfigurasikan melalui objek skrip atau Pemalam Metadata jQuery.

Lalai global:

Salin kod

Kod adalah seperti berikut:

$.fn.media.defaults = { preferMeta: 1, // Jika benar, nilai meta teg diutamakan berbanding objek skrip autoplay: 0, // Tetapan silang pemain standard bgColor: '#ffffff', // warna latar belakang params: {}, // Tambahkan pada teg objek sebagai elemen param; attrs: {}, // Tambahkan pada objek dan benamkan sebagai atribut

flashvars: {}, // Tambahkan pada flash sebagai parameter atau atribut flashvars

flashVersion: '7', // Versi flash minimum diperlukan
// Video denyar lalai dan pemain mp3 // @lihat:
http://jeroenwijering.com/?item=Flash_Media_Player

flvPlayer: 'mediaplayer.swf',
mp3Player: 'mediaplayer.swf',
// Pilihan Silverlight // @lihat
http://msdn2.microsoft.com/en-us/library/bb412401.aspx

cahaya perak: { inplaceInstallPrompt: 'true', // Paparkan gesaan pemasangan di lokasi yang sesuai isWindowless: 'true', // Mod tanpa Windowless
kadar bingkai: '24', // Kadar bingkai maksimum
versi: '0.9', // versi Silverlight onError: null, // fungsi panggil balik onError
onLoad: null, // fungsi panggil balik onLoad initParams: null, // Parameter pemulaan objek userContext: null // Parameter yang dihantar ke fungsi panggil balik muat
}
};

Kami juga boleh memasukkan beberapa parameter pilihan apabila melaksanakan skrip permulaan, seperti yang ditunjukkan dalam kod berikut:

Salin kod Kod adalah seperti berikut:

$('.media').media( { lebar: 400, tinggi: 300, automain: benar } );

Contoh lain ialah kod:

Salin kod Kod adalah seperti berikut:

$('.media').media({
lebar: 450,
tinggi: 250,
automain: benar,
src: 'myBetterMovie.mov',
attrs: { attr1: 'attrValue1', attr2: 'attrValue2' }, // object/embed attrs
params: { param1: 'paramValue1', param2: 'paramValue2' }, // object params/embed attrs
kapsyen: palsu // menyekat teks kapsyen
});

Pilihan 'src'

Pilihan

src menentukan alamat fail media. Ia tidak mempunyai nilai lalai global. Jika nilai pilihan src yang ditentukan tidak ditunjukkan, jQuery Media Plugin akan menggunakan nilai atribut href atau src sebaliknya.

Pemain dan format

Pemalam Media jQuery secara lalai kepada pemain dan format seperti yang ditunjukkan dalam jadual berikut:

Pemain	Format fail
Masa Cepat	aif,aiff,aac,au,bmp,gsm,mov,mid, midi,mpg,mpeg,mp4,m4a,psd,qt,qtif, qif,qti,snd,tif,tiff,wav, 3g2,3pg
Denyar	flv, mp3, swf
Windows Media Player	asx, asf, avi, wma, wmv
Pemain Sebenar	ra, ram, rm, rpm, rv, smi, smi
Silverlight	xaml
iframe	html, pdf

Die obige Tabelle zeigt, dass das MP3-Format automatisch dem Flash-Player zugeordnet wird. $.fn.media.defaults.mp3Player in der globalen Konfiguration gibt an, dass MP3-Medien von der Datei mediaplayer.swf abgespielt werden. Die SWF-Datei ist ein kleiner MP3- und Flash-Videoplayer, der hier heruntergeladen werden kann: http://www.longtailvideo.com/players/jw-flv-player/

SWFObject

Dieses Skript ist sehr verbreitet und wird zum Einbetten von Flash-Inhalten in Webseiten verwendet. Sie müssen die Flash-Einbettungsmethoden verschiedener Plattformen nicht berücksichtigen. Diese Datei ist jedoch nicht erforderlich. Wenn es geladen ist, wird es vom jQuery Media Plugin verwendet, andernfalls generiert das jQuery Media Plugin Objekt-/Einbettungs-Tags auf seine eigene Standardmethode. Weitere Informationen finden Sie unter: http://code.google.com/p/swfobject/

iframe Player

Standardmäßig werden PDF- und HTML-Formate iFrames zugeordnet. Sie werden in einem Iframe und nicht in einem Objekt-/Einbettungs-Tag angezeigt.

Formatzuordnung hinzufügen oder ändern

Dieser Vorgang kann durch die MapFormat-Methode des Plug-Ins implementiert werden, z. B.

$.fn.media.mapFormat('mp3','quicktime');
Verfügbare Player sind: uicktime, flash, realplayer, winmedia, silverlight und iframe. Stellen Sie sicher, dass der Player das damit verbundene Dateiformat abspielen kann.

Herunterladen

Laden Sie die Datei jquery.media.js direkt herunter oder laden Sie die historische Version auf Github

herunter

Hinweis:

Dieses Plug-in konvertiert <a> in <div> Dieses Plugin ist genauso einfach und benutzerfreundlich wie andere JQuery-Plugins.