Saturday, July 25, 2015

23. HTML Embed Multimedia

 HTML Tutorial

Sometimes you need to add music or video into your web page. The easiest way to add video or sound to your web site is to include the special HTML tag called . This tag causes the browser itself to include controls for the multimedia automatically provided browser supports tag and given media type.
You can also include a </b> tag for the browsers which don't recognize the <embed> tag. You could, for example, use <embed> to display a movie of your choice, and <noembed> to display a single JPG image if browser does not support <embed> tag.</p> <h3> Example</h3> <p> Here is a simple example to play an embedded midi file:</p> <pre style="" class="prettyprint notranslate tryit prettyprinted"><span class="dec"><!--DOCTYPE html--></span><span class="pln"> </span><span class="tag"><html></span><span class="pln"> </span><span class="tag"><head></span><span class="pln"> </span><span class="tag"><title></span><span class="pln">HTML embed Tag</span><span class="tag"></title></span><span class="pln"> </span><span class="tag"></head></span><span class="pln"> </span><span class="tag"><body></span><span class="pln"> </span><span class="tag"><embed</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"/html/yourfile.mid"</span><span class="pln"> </span><span class="atn">width</span><span class="pun">=</span><span class="atv">"100%"</span><span class="pln"> </span><span class="atn">height</span><span class="pun">=</span><span class="atv">"60"</span><span class="pln"> </span><span class="tag">></span><span class="pln"> </span><span class="tag"><noembed><img</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"yourimage.gif"</span><span class="pln"> </span><span class="atn">alt</span><span class="pun">=</span><span class="atv">"Alternative Media"</span><span class="pln"> </span><span class="tag">>
This will produce following result:
You can put any media file in src attribute. You can try it yourself by giving various types of files.

The Tag Attributes

Following is the list of important attributes which can be used with tag.
AttributeDescription
alignDetermines how to align the object. It can be set to either center, left or right.
autostartThis boolean attribute indicates if the media should start automatically. You can set it either true or false.
loopSpecifies if the sound should be played continuously (set loop to true), a certain number of times (a positive value) or not at all (false)
playcountSpecifies the number of times to play the sound. This is alternate option for loop if you are usiong IE.
hiddenSpecifies if the multimedia object should be shown on the page. A false value means no and true values means yes.
widthWidth of the object in pixels
heightHeight of the object in pixels
nameA name used to reference the object.
srcURL of the object to be embedded.
volumeControls volume of the sound. Can be from 0 (off) to 100 (full volume).

Supported Video Types

You can use various media types like Flash movies (.swf), AVI's (.avi), and MOV's (.mov) file types inside embed tag.
  • .swf files - are the file types created by Macromedia's Flash program.
  • .wmv files - are Microsoft's Window's Media Video file types.
  • .mov files - are Apple's Quick Time Movie format.
  • .mpeg files - are movie files created by the Moving Pictures Expert Group.



</span><span class="pln">HTML embed Tag</span><span class="tag">
src="/html/yourfile.swf" width="200" height="200" > <img</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"yourimage.gif"</span><span class="pln"> </span><span class="atn">alt</span><span class="pun">=</span><span class="atv">"Alternative Media"</span><span class="pln"> </span><span class="tag">> This will produce following result:

Background Audio

You can use HTML tag to play a soundtrack in the background of your webpage. This tag is supported by Internet Explorer only and most of the other browsers ignore this tag. It downloads and plays an audio file when the host document is first downloaded by the user and displayed. The background sound file also will replay whenever the user refreshes the browser.
This tag is having only two attributes loop and src. Both these attributes have same meaning as explained above.
Here is a simple example to play a small midi file:



</span><span class="pln">HTML embed Tag</span><span class="tag">
src="/html/yourfile.mid"> <img</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"yourimage.gif"</span><span class="pln"> </span><span class="tag">> This will produce blank screen. This tag does not display any component and remains hidden.
Internet Explorer can also handle only three different sound format files: wav, the native format for PCs; au, the native format for most Unix workstations; and MIDI, a universal music-encoding scheme.

HTML Object tag

HTML 4 introduces the element, which offers an all-purpose solution to generic object inclusion. The element allows HTML authors to specify everything required by an object for its presentation by a user agent

Here are few examples:

Example - 1

You can embed an HTML document in an HTML document itself as follows:

 data="data/test.htm" type="text/html" width="300" height="200">
  alt :  href="data/test.htm">test.htm

Here alt attribute will come into picture if browser does not support object tag.

Example - 2

You can embed a PDF document in an HTML document as follows:

 data="data/test.pdf" type="application/pdf" width="300" height="200">
  alt :  href="data/test.pdf">test.htm

Example - 3

You can specify some parameters related to the document with the tag. Here is an example to embed a wav file:
 data="data/test.wav" type="audio/x-wav" width="200" height="20">
   name="src" value="data/test.wav">
   name="autoplay" value="false">
   name="autoStart" value="0">
  alt :  href="data/test.wav">test.wav

Example - 4

You can add a flash document as follows:
 classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="penguin" 
   codebase="someplace/swflash.cab" width="200" height="300">
    name="movie" value="flash/penguin.swf" />
    name="quality" value="high" />
    src="penguin.jpg" width="200" height="300" alt="Penguin" />

Example - 5

You can add a java applet into HTML document as follows:
 classid="clsid:8ad9c840-044e-11d1-b3e9-00805f499d93" 
   width="200" height="200">
    name="code" value="applet.class">
The classid attribute identifies which version of Java Plug-in to use. You can use the optional codebase attribute to specify if and how to download the JRE.

0 comments:

Post a Comment

 
Designed by Kakada Akkarak Surakkiat
Technology: របៀប​ដំឡើង Windows 10 នៅ​លើ​កុំព្យូទ័រ!: អ្នកត្រូវដឹងឲ្យ ច្បាស់ពី Windows ដែលអ្នកយក ទៅដំឡើង ដោយសារមាន Windows ខ្លះមានការ crack រួច ឬខ្លះត្រូវការ Product key ភ្លាម និងខ្លះទៀត អាចត្រូវ skip កន្លែងវាយលេខ Product key បាន តែត្រូវ Activate តាមក្រោយ ទើបប្រើប្រាស់បាន។ Technology: ដំណោះ​ស្រាយ Error 80240020 នៅ​ពេល​តម្លើង Windows 10 Free តាម​រយៈ​ការ Upgrade : មាន បញ្ហាមួយចំនួន ទាក់ទងនឹង ការតម្លើង Windows 10 នេះផងដែរ ប៉ុន្តែបញ្ហានោះ កើតឡើង ទៅលើតែកុំព្យូទ័រ មួយចំនួនប៉ុណ្ណោះ គឺខណៈពេល ដែលអ្នក ប្រើប្រាស់ បានទាញយក Windows 10 ចប់ហើយ វាបាន បង្ហាញនូវ ផ្ទាំង error មួយ ដែលមានលេខ សំគាល់ error នោះគឺ 80240020។ ដូចនេះដើម្បី ដោះស្រាយ នូវបញ្ហា មួយនេះ សូមលោកអ្នក តាមដានអាន ជាមួយយើងខ្ញុំ ទាំងអស់គ្នា !!