html5-voideo_DOM
2021-03-30 22:25
标签：document ice func text css color class else type HTML5 为视频创建简单的播放/暂停以及调整尺寸控件： 代码如下： 运行结果如图 html5-voideo_DOM 标签：document ice func text css color class else type 原文地址：https://www.cnblogs.com/sad-dog/p/12590285.htmlDOCTYPE html>
html lang="zh">
head>
meta charset="UTF-8">
meta name="viewport" content="width=device-width, initial-scale=1.0">
meta http-equiv="X-UA-Compatible" content="ie=edge">
title>title>
style type="text/css">
.box{
text-align: center;
}
style>
head>
body>
div class="box">
button onclick="playPase()">播放/暂停button>
button onclick="makeBig()">大button>
button onclick="makeNormal()">中button>
button onclick="makeSmall()">小button>
br>
video id="video1" width="420" style="margin-top: 15px;">
source src="video/despacito.mp4" type="video/mp4">
source src="video/despacito.ogg" type="video/video/ogg">
video>
div>
script type="text/javascript">
var Ovideo=document.getElementById("video1");
function playPase(){
if(Ovideo.pause){
Ovideo.play();
}else{
Ovideo.pause();
}
}
function makeBig(){
Ovideo.width=560;
}
function makeSmall(){
Ovideo.width=320;
}
function makeNormal(){
Ovideo.width=420;
}
script>
body>
html>
