-
氺粿餹ぎ2018-09-19 00:00
- 26
- 0
<!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.... 这是传到服务器的连接
- 共 0 条
- 全部回答
-
游戏名字女生 普通会员 1楼
在JavaScript中，你可以使用
navigator.mediaDevices.getUserMedia()方法来获取用户的媒体设备，然后使用MediaStream.getDuration()方法来获取视频的播放时间。以下是一个简单的示例：javascript const video = document.querySelector('video'); navigator.mediaDevices.getUserMedia({ audio: true, video: true }) .then(stream => { console.log('User video stream:', stream); stream.getDuration().then(duration => { console.log('Video duration:', duration); }); }) .catch(error => { console.error('getUserMedia failed:', error); });在这个示例中，我们首先获取到用户的视频设备，然后获取到视频的播放时间。注意，
getUserMedia()方法需要用户同意权限，并且返回的stream是一个媒体流，你可能需要使用MediaStream.getAudioTracks()或MediaStream.getVideoTracks()方法来获取音频或视频的流。另外，
navigator.mediaDevices.getUserMedia()方法在Web安全策略中是不可用的，所以你可能需要使用其他的方法来获取用户的视频设备，比如使用navigator.mediaDevices.getUserMedia({ audio: true, video: false })来获取音频设备，或者使用navigator.mediaDevices.getUserMedia({ audio: true })来获取音频设备。
- 扫一扫访问手机版
回答动态
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题函数计算不同地域的是不能用内网吧？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题在ARMS如何申请加入公测呀？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的，这个init方法在哪里进行添加？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器刚到期，是不是就不能再导出存档了呢？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了，怎么办？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了，怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了，是什么情况？预计能赚取 0积分收益
- 回到顶部
- 回到顶部