视频

最新推荐文章于 2021-05-28 21:59:41 发布

gh323093

最新推荐文章于 2021-05-28 21:59:41 发布

阅读量159

点赞数 1

分类专栏： Web前端

本文链接：https://blog.csdn.net/gh323093/article/details/78444394

版权

Web前端专栏收录该内容

56 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>播放/暂停</title>
    <style type="text/css">
        .bg {position: relative; float: left;}
        .fd_gif {position: absolute;z-index:99;top:0;left:0;margin-left: 120px; margin-top: 60px;}
        input{
            width: 60px;
            height: 30px;
        }
    </style>
    <script type="text/javascript">
        function bofang(v){
            var id = v.nextSibling;
            while(id.nodeType!=1){
                id=id.nextSibling;
            }
            id.style.display = "block";
        }
        function bofang1(v){
            var id = v.parentNode;
            id.style.display = "block";
        }
        function huachu(v){

            var id = v.nextSibling;
            while(id.nodeType!=1){
                id=id.nextSibling;
            }
            console.log(id);
            id.style.display = "none";
        }
        function dianji(mdiv){
            if (mdiv.value == "播放"){
                var v = mdiv.parentNode.previousSibling;
                while(v.nodeType!=1){
                    v=v.previousSibling;
                }
                v.play();
                mdiv.value = "暂停";
            }else{
                var v = mdiv.parentNode.previousSibling;
                while(v.nodeType!=1){
                    v=v.previousSibling;
                }
                v.pause();
                mdiv.value = "播放";
            }
        }
    </script>
</head>
<body>
<div>
    <div class="bg">
        <video width="300" loop="loop" οnmοuseοver="bofang(this)" οnmοuseleave="huachu(this)">
            <source src="video/dongjing.mp4"/>
        </video>
        <div class="fd_gif" style="display: none;">
            <input type="button" value="播放" οnclick="dianji(this)" οnmοuseοver="bofang1(this)" />
        </div>
    </div>

    <div class="bg">
        <video width="300" loop="loop" οnmοuseοver="bofang(this)" οnmοuseleave="huachu(this)">
            <source src="video/dongjing.mp4"/>
        </video>
        <div class="fd_gif" style="display: none;">
            <input type="button" value="播放" οnclick="dianji(this)" οnmοuseοver="bofang1(this)" />
        </div>
    </div>

    <div class="bg">
        <video width="300" loop="loop" οnmοuseοver="bofang(this)" οnmοuseleave="huachu(this)">
            <source src="video/dongjing.mp4"/>
        </video>
        <div class="fd_gif" style="display: none;">
            <input type="button" value="播放" οnclick="dianji(this)" οnmοuseοver="bofang1(this)" />
        </div>
    </div>
</body>
</html>

gh323093

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
视频

html>html>head> meta charset="UTF-8"> title>播放/暂停title> style type="text/css"> .bg {position: relative; float: left;} .fd_gif {position: absolute;z-index:99;top:0;left:0;
复制链接

扫一扫