<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<style>
*{
margin: 0;
padding: 0;
}
.v_box{
width: 100%;
height: auto;
}
.v_box .v_ul li{
position: relative;
}
.v_box .v_btn{
width: 100%;
height: 100%;
background: #ccc;
position: absolute;
top: 0;
left: 0;
z-index: 999;
}
.v_box .v_btn1{
display: none;
}
.v_box .v_btn2{
display: none;
}
.v_block{
display: block!important;
}
</style>
<body>
<script src="http://api.html5media.info/1.1.8/html5media.min.js"></script>
<div class="v_box">
<ul class="v_ul">
<li>
<video src="mp4/2.mp4" class="videos" title="1" poster="images/bg2.jpg" width="100%" height="600" controls autobuffer></video>
<div class="v_btn v_btn1">
</div>
</li>
<!-- <li>
<video src="mp4/2.mp4" class="videos" title="1" poster="images/bg2.jpg" width="100%" height="600" controls autobuffer></video>
<div class="v_btn v_btn2">
</div>
</li>-->
</ul>
</div>
<div id="d1" style="width: 100%;height: 300px;border: 1px solid red;">
<div id="d2" style="background: #aaa000;display: none;width: 300px;height: 300px;position: relative;z-index: 999;">
</div>
</div>
<script src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script>
$(function () {
$('.v_ul li').click(function () {
if ($(this).children("video").hasClass('pause')) {
$(this).children("video").trigger("play");
$(this).children("video").removeClass('pause');
$(this).children("video").addClass('play');
} else {
$(this).children("video").trigger("pause");
$(this).children("video").removeClass('play');
$(this).children("video").addClass('pause');
}
})
$('.videos').bind('play', function () {
console.log("正在播放视频");
var v=$(this);
var t=$(this).next();
setTimeout(function(){
t.addClass("v_block");
v.trigger("pause");
/* v.removeClass('play');*/
/*t.css({"display":"block"});*/
}, 3000);
});
$("#d1").click(function () {
setTimeout(function(){
$("#d2").css({"display":"block"});
}, 3000);
});
});
</script>
</body>
</html>
我想实现 视频在播放到3秒后暂停 div(v_btn)显示,在电脑上没问题 但传到服务器
手机打开 视频播放到三秒后暂停 但是 下面div没显示 怎么回事 找了半天没找到原因 求指点?谢谢
http://www.yulijie.top/mp4/e.... 这是传到服务器的连接
怎么复制视频的播放时间呢?