Javascript多媒體
JavaScript的navigator對象包括被稱為插件的子對象。這個對象是一個數組,為每個插件安裝在瀏覽器中的一個條目。該navigator.plugins對象僅Netscape,Firefox和Mozilla支持。
下麵是一個例子,列出了使用瀏覽器安裝的所有插件:
<html> <head> <title>List of Plug-Ins</title> </head> <body> <table border="1"> <tr> <th>Plug-in Name</th> <th>Filename</th> <th>Description</th> </tr> <script language="JavaScript" type="text/javascript"> for (i=0; i<navigator.plugins.length; i++) { document.write("<tr><td>"); document.write(navigator.plugins[i].name); document.write("</td><td>"); document.write(navigator.plugins[i].filename); document.write("</td><td>"); document.write(navigator.plugins[i].description); document.write("</td></tr>"); } </script> </table> </body> </html>
檢查插件:
每個插件有數組中的一個條目。每個條目具有以下屬性:
-
name - 是插件的名稱
-
filename - 是被裝載到安裝在插件中的可執行文件
-
description - 是插件的描述,通過開發人員提供
-
mimeTypes - 是使用由插件支持的每個MIME類型一個條目的陣列
可以在腳本中使用這些屬性來了解安裝的插件,然後使用JavaScript,你可以按如下起到相應的多媒體文件:
<html> <head> <title>Using Plug-Ins</title> </head> <body> <script language="JavaScript" type="text/javascript"> media = navigator.mimeTypes["video/quicktime"]; if (media){ document.write("<embed src='quick.mov' height=100 width=100>"); } else{ document.write("<img src='quick.gif' height=100 width=100>"); } </script> </body> </html>
注意:這裡我們使用HTML <embed>標簽嵌入多媒體文件。
多媒體控製:
我們需要一個真實的例子幾乎可在所有的瀏覽器上工作:
<html> <head> <title>Using Embeded Object</title> <script type="text/javascript"> <!-- function play() { if (!document.demo.IsPlaying()){ document.demo.Play(); } } function stop() { if (document.demo.IsPlaying()){ document.demo.StopPlay(); } } function rewind() { if (document.demo.IsPlaying()){ document.demo.StopPlay(); } document.demo.Rewind(); } //--> </script> </head> <body> <embed id="demo" name="demo" src="http://www.amrood.com/games/kumite.swf" width="318" height="300" play="false" loop="false" pluginspage="http://www.macromedia.com/go/getflashplayer" swliveconnect="true"> </embed> <form name="form" id="form" action="#" method="get"> <input type="button" value="Start" onclick="play();" /> <input type="button" value="Stop" onclick="stop();" /> <input type="button" value="Rewind" onclick="rewind();" /> </form> </body> </html>