html5——点击按钮后视频自动播放

来源：互联网发布：淘宝快递单打印助手编辑：程序博客网时间：2024/06/05 17:12

cesium项目里要播放视频，要求点击子菜单后直接播放视频，上网上查找代码后完成了效果。此处贴上代码

前台代码：

 <div id='toolbar3' style="position: absolute; left: 5px; top: 5px; display: none;">     <div>         <img src="tp/t12.png" class="btnClose3" id="btnclose3" onclick="BtnClose3()" title="关闭" />         <video controls="controls" width="800" id="video">              <source src="video/20160712水合物三维demo示意图DEMO.mp4" type="video/mp4" />              <source src="video/20160712水合物三维demo示意图DEMO.webm" type="video/webm" />         </video>     </div> </div>

后台代码：

//摄像视频function shexiang() {    FlyToPos_gao(116.2910693, 17.7994841, 100000.0);    var toolbar2 = document.getElementById('toolbar3');    var myvideo = document.getElementById('video');    if (shexiang_display = document.getElementById('toolbar3').style.display == 'none') {    //如果toolbar是隐藏        document.getElementById('toolbar3').style.display = 'block';//toolbar的display属性设置为block（显示)        if (myvideo.pause) myvideo.play();    }    else {    //如果toolbar是显示的        document.getElementById('toolbar3').style.display = 'none';//toolbar的display属性设置为none（隐藏）    }}

效果：

点击图片或文字出现视频并自动播放

阅读全文

0 0