Bookmark and Share HTML Video Codes (HTML Tutorial part 29)

১১/১৮/২০১১ ০৮:৫০:০০ AM | | 0 comments »

Videos can be embedded into your html documents (web pages) two different ways. One method is to use the <embed /> tag to display your media file. The embed tag does not require a closing tag. In fact, it works much like the image tag. A src attribute must be defined by the correct URL (local or global) in order for the video file to be displayed correctly. Here is a look at the embed tag with a global URL, feel free to use this URL while you practice.

HTML Code:

<embed src="http://www.tizag.com/files/html/htmlexample.mpeg"
 autostart="false" />

Mpeg Movie:

You may start and stop your movie files by either pressing the buttons at the bottom of the object or by single clicking (stop) on the object and double clicking your mouse (continue/play).
You may also simply place the URL of your media files into the href attribute of an anchor tag, much like the concept of "thumbnailing" images.

HTML Code:

<a href="http://www.tizag.com/pics/flash/motiontween1easy.swf">
motiontween1easy.swf</a>

Flash Media:

motiontween1easy.swf

HTML - Video Media Types

Flash movies (.swf), AVI's (.avi), and MOV's (.mov) file types are supported by the 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 - set the standard for compression movie files created by the Moving Pictures Expert Group.
The listings above are the most commonly used formats for the internet. ".mpeg" files and Macromedia's .swf files are the most compact and widely used among the internet. Stick to any of the file types above for use with your web pages.

HTML - Embed Attributes

Along with the previously discussed src attribute, there are some unique attributes available to the <embed /> tag including: volume, autostart, hidden, and loop.
  • autostart - controls the media's ability to start without prompting. Values are true or false.
  • hidden - controls whether or not the play/stop/pause embedded object is hidden or not. Values are true or false. (Hide your embeded media if you just want background noise).
  • loop - A true value means the media will continuously loop, false means no looping.
  • playcount - Setting a playcount means the media will repeat itself x number of times instead of continuously as with the loop attribute above. (playcount="2" will repeat the video twice).
  • volume - set a numeric value for the loudness of your media. (0-100).

HTML - Google Video

Google video has recently gained popularity as a source for sharing movies on the internet. At Google Video it is possible to search for any type of movie. Google allows you to download and display these movies on any of your own html pages.
As you search through videos there Google has provided a text area with an embed tag inside of it. Copy this text area to your own HTML pages to embed Google videos onto your own pages.

HTML Code:

<! -- Google Video HTML Code -- >

<embed style="width:400px; height:326px;" id="VideoPlayback" 
align="middle" type="application/x-shockwave-flash" 
src="http://video.google.com/googleplayer.swf?videoUrl=http%3A%
2F%2Fvp.video.google.com%2Fvideodownload%3Fversion%3D0%26
secureurl%3DvgAAAG7ggqAHSiJjpW0D3w4aYTUFW9M-NghJgbJjy8mhm
cEoPD-qcpQj2i1OD9xJ6RseUKhCxEKqxhx0jnEJlzf04o-E7gUJc5z_Ur
OEGJAZeqGJwm5u3VIm_6cNAj34Tj_GwI13lu4V8_s49xIsqh8GGFa2yKI
pP3DN-u3fZclxMdm3EKZKMqwjROPGPOcl1AMH17kgA5XA503H4WS0Gefm
G5TKWrRHsY2d3pOatXR_2IxBzGEIq5p-9ybrmmn_o0zj6g%26sigh%3DP
dJGakwLdDs6uXBefAsAxQMQDls%26begin%3D0%26len%3D3569%26doc
id%3D8734085858581743191&thumbnailUrl=http%3A%2F%2Fvi
deo.google.com%2FThumbnailServer%3Fapp%3Dvss%26contentid%
3Dbc66969d46ff8d61%26second%3D0%26itag%3Dw320%26urlcreate
d%3D1147452288%26sigh%3DhQlKmBGLA2yrYhrTGpU029bCEHA&p
layerId=8734085858581743191" allowScriptAccess="sameDomain" 
quality="best" bgcolor="#ffffff" scale="noScale" 
wmode="window" salign="TL" FlashVars="playerMode=embedded">
</embed>

<! -- End of Google Video HTML Code -->
It is a messy code above, but once you put it into your HTML documents you get a great video clip.

এতে সদস্যতা: মন্তব্যগুলি পোস্ট করুন (Atom)