zoukankan      html  css  js  c++  java
  • 视频 网站 页面开关灯实现方法

    在甲骨文学习 已经进行了四分之一了,  关于web 的学习基本结束了, 在项目展示的时候遇到了 视频网站开关灯的问题, 其实问题的根本就是 做两个div,  然后开灯的时候隐藏一个 关灯的时候 隐藏另一个。过程通过js来实现,下面是基本过程;

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    </head>
    <script type="text/javascript">
    function one(){
    var qq = document.getElementById("div1");
    qq.setAttribute("class","aaa");
    var ww = document.getElementById("div2");
    ww.setAttribute("class","bbb");
    }
    function two(){
    var ee = document.getElementById("div1");
    ee.setAttribute("class","aa");
    var rr = document.getElementById("div2");
    rr.setAttribute("class","bb");
    }
    </script>
    <style>
    .aaa{
    display: none;
    }
    .bb{
    display: none;
    }

    </style>

    <body>
    <div id="div1" class="aa">
    <div id="gdan" onClick="one()">关灯</div>
    </div>
    <div id="div2" class="bb">
    <div id="kdan" onClick="two()" style="background-color: black; color: aliceblue">开灯</div>
    </div>
    </body>
    </html>

  • 相关阅读:
    6.4 记录
    Python向mysql数据库插入数据
    6.2号课下作业测试标准的好坏
    模糊查询
    日常开发问题解决
    日常开发问题解决
    tomcat容器启动失败疑难问题解决方案
    5.14 记录
    5.13 记录
    关于HTTP,TCP,IP的一些基础知识
  • 原文地址:https://www.cnblogs.com/wangyufei123/p/7746110.html
Copyright © 2011-2022 走看看