Embed a video in your HTML5 page with a width of '320' and height of '200' with controls displayer. Now, try to do the following:
- Auto-replay the video
- Preload the video
- Display image while the video loads
"https://cdn12.picryl.com/photo/2016/12/31/lego-stones-plastic-education-8b9a7d-1024.jpg" as the display image
Steps to do hands-on:
- install the required packages by clicking the install button
- write the code
- run the application and test it
Answer:
<!DOCTYPE html>
<html>
<head>
<link rel="icon" href="favicon.png" type="image/png">
<title>Destiny</title>
<link href="mystyle.css" rel="stylesheet" type="text/css">
</head>
<body>
//write your code here
<video autoplay height="200" width="320">
<source src="video.mp4">
</video>
<video controls preload height="200" width="320">
<source src="video.mp4">
</video>
<video autoplay height="200" width="320"
poster="https://cdn12.picryl.com/photo/2016/12/31/lego-stones-plastic-education-8b9a7d-1024.jpg">
<source src="video.mp4">
</video>
</body>
</html>
Note: poster is written in very low font because of insufficient page width
Click on tested image
No comments:
Post a Comment
If you have any doubts, Please let us know.