Web Programming Training By OM SIR Call for free Demo :9320957717/18

video tag

HTML <video> Tag:

Description:

The HTML <video> tag is used to embed video into your web page, it has several video sources.
<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

<p><strong>Note:</strong> The video tag is not supported in Internet Explorer 8 and earlier versions.</p>

</body>
</html>






How to Llink   youtube    video   tag :

<html>
<head>
<title> iframe tage youtube video example</title>
</head>
<body>
<iframe width="560" height="315" src="https://www.youtube.com/embed/dUTmP3N1_AY" frameborder="0" allowfullscreen></iframe>
</body>
</html>








HTML <video> autoplay Attribute:


<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls autoplay>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

<p><strong>Note:</strong> The video tag is not supported in Internet Explorer 8 and earlier versions.</p>

</body>
</html>





HTML <video> controls   Attribute:


<!DOCTYPE  html>
<html>
<body>

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

<p><strong>Note:</strong> The video tag is not supported in Internet Explorer 8 and earlier versions.</p>

</body>
</html>
The controls attribute is a boolean attribute.
When present, it specifies that video controls should be displayed.
Video controls should include:
  • Play
  • Pause
  • Seeking
  • Volume
  • Fullscreen toggle
  • Captions/Subtitles (when available)
  • Track (when available)

HTML <video> height Attribute


Example

A video player with a specified height and width:
<video width="320" height="240" controls>
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

HTML <video> loop Attribute

Example

A video that will start over again, every time it is finished:
<video controls loop>
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>
The loop attribute is a boolean attribute.
When present, it specifies that the video will start over again, every time it is finished.

HTML <video> muted Attribute

Example

A muted video:
<video controls muted>
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>


Definition and Usage

The muted attribute is a boolean attribute.
When present, it specifies that the audio output of the video should be muted.

HTML <video> poster Attribute

Example

A video player with a poster image:
<video controls poster="/images/w3html5.gif">
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Definition and Usage

The poster attribute specifies an image to be shown while the video is downloading, or until the user hits the play button. If this is not included, the first frame of the video will be used instead.

HTML <video> preload Attribute

Example

Author thinks that the video should NOT be loaded when the page loads:
<video controls preload="none">
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Definition and Usage

The preload attribute specifies if and how the author thinks that the video should be loaded when the page loads.
The preload attribute allows the author to provide a hint to the browser about what he/she thinks will lead to the best user experience. This attribute may be ignored in some instances.
Note: The preload attribute is ignored if autoplay is present.

HTML <video> src Attribute

Example

Play a video:
<video src="movie.ogg" controls>
  Your browser does not support the video tag.
</video>

Definition and Usage

The src attribute specifies the location (URL) of the video file.
The example above uses an Ogg file, and will work in Firefox, Opera and Chrome.
To play the video in Internet Explorer and Safari, we must use an MPEG4 file.
To make it work in all browsers - use <source> elements inside the <video> element. <source> elements can link to different video files. The browser will use the first recognized format:

Example

<video width="320" height="240" controls>
  
<source src="movie.mp4" type="video/mp4">
  
<source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>


Previous
Next Post »

1 comments:

Write comments
Garima Ahuja
AUTHOR
23 October 2017 at 02:36 delete

is it use in wordpress panel as well ?
for
https://sisgain.com/hire-iphone-developer

Reply
avatar