需求:页面中有2个普通按钮a,b。还有一个video标签,能成功播放出视频。。我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!
----------------------------------------------------code---------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<title>Simple JavaScript Controller</title>
<script type="text/javascript">
function playPause() {
var myVideo = document.getElementsByTagName('video')[0]; //获取视频video
if (myVideo.paused){
myVideo.play();
}else{
myVideo.pause();
}
function makeBig() { //全屏 高度2倍
var myVideo = document.getElementsByTagName('video')[0];
myVideo.height = (myVideo.videoHeight * 2 ) ;
}
function makeNormal() { //取消全屏
var myVideo = document.getElementsByTagName('video')[0];
myVideo.height = (myVideo.videoHeight) ;
}
</script>
</head>
<body>
<div class="video-player" align="center">
<video src="myMovie.m4v" poster="poster.jpg" ></video> <!--视频 -->
<br>
<a href="javascript:playPause();">Play/Pause</a> <br> <!--播放 暂停-->
<a href="javascript:makeBig();">2x Size</a> <!--放大视频-->
[解决办法]
<a href="javascript:makeNormal();">1x Size</a> <br> <!--还原视频 -->
</div>
</body>
</html>
[解决办法]:
var myVideo = document.getElementsByTagName('video')[0];
可以换成
document.getElementById('videoId');
<video src="myMovie.m4v" poster="poster.jpg" id="videoId"></video>
[解决办法]
额。来晚了。。。
停止的话...
myVideo.currentTime = 0; //属性设置或返回音频/视频播放的当前位置(以秒计)。当设置该属性时,播放会跳跃到指定的位置。
myVideo.pause();
------解决方案--------------------
mark
原文地址:http://www.reader8.cn/jiaocheng/20130619/1350009.html
http://www.reader8.cn/jiaocheng/javascript/