2 wsxcqesx123 wsxcqesx123 于 2016.03.28 01:03 提问

有关用视频做HTML网页背景的一些疑问
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>动画背景</title>
<style>
body{
margin:0;
}
video{
position:fixed;
right:0;
bottom:0;
min-width:100%;
min-height:100%;
width:auto;
height:auto;
z-index:-9999;
}

</style>
</head>
<body>
<video autoplay muted style="width:100%;">
<source src="动画背景5.mp4">
</video>
</body>
</html>

这是百度搜来的一个用视频作为网页背景的代码,现在有个疑问,如何在这段背景播放完之后让背景转换成一个固定的图片或者换个思路让视频停留在最后一帧也行,可以实现么

2个回答

showbo
showbo   Ds   Rxr 2016.03.28 10:03
已采纳
 添加ended事件,然后给body设置背景图片什么的
<video autoplay muted style="width:500px;" id="video1">
    <source src="xxx.mp4">
</video>
<script>
    var v = document.getElementById('video1');
    v.addEventListener('ended', function () {
        alert('视频播放完毕!')
                //....设置背景图片,移除video标签等代码
    }, false);
</script>
wr10980170
wr10980170 厉害呦!
一年多之前 回复
hanfeizaopao
hanfeizaopao   2016.03.28 09:12

可以的
1 直接当背景是不可行的,但是你可以实现一个视频然后浮动定位
2 html5有针对最后一针的停止
3 你也可以播放完了有个回调 去隐藏播放器然后显示图片
望采纳

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!