zoukankan      html  css  js  c++  java
  • 0815 document对象

    p{ color:#F00;
    font-size:36px;}
    #aa
    {
     500px;
     height:400px;
     position:relative;
     background-image:url(images/1.jpg);
     background-size:contain;
     background-repeat:no-repeat;}
    </style>
    <script type="text/javascript">
    document.write("<p>设置一个div,准备好3张图片,设置3个按钮,分别更改不同的背景,默认是第一张(类似于QQ空间更换主题)</p><br />123456789");
    </script>
    </head>

    <body>
    <div id="aa"></div><br />
    <input id="a" style="" type="button" value="第一张" onmouseover="change1()" />
    <input id="b" type="button" value="第二张" onmouseover="change2()" />
    <input id="c" type="button" value="第三张" onmouseover="change3()" /><br />
    <br />
    <img src="images/1.jpg" width="512" id="bb" /><br />
    <input style="" type="button" value="第一张" onmouseover="change11()" />
    <input type="button" value="第二张" onmouseover="change22()" />
    <input type="button" value="第三张" onmouseover="change33()" />

    </body>
    </html>
    <script>
    var a =document.getElementById("a");
    var b =document.getElementById("b");
    var c =document.getElementById("c");
    function change11()
    {
     var aa = document.getElementById("bb");
     aa.src="images/1.jpg";
     
    }
    function change22()
    {
     var aa = document.getElementById("bb");
     aa.src="images/2.jpg";
     
    }
    function change33()
    {
     var aa = document.getElementById("bb");
     aa.src="images/3.jpg";
     
    }

    function change1()
    {
     var aa = document.getElementById("aa");
     aa.style.backgroundImage ="url(images/1.jpg)";
     a.style.backgroundColor="#6F3";
     b.style.backgroundColor="#CCC";
     c.style.backgroundColor="#CCC";
    }
    function change2()
    {
     var aa = document.getElementById("aa");
     aa.style.backgroundImage ="url(images/2.jpg)";
     b.style.backgroundColor="#6F3";
     a.style.backgroundColor="#CCC";
     c.style.backgroundColor="#CCC";
    }
    function change3()
    {
     var aa = document.getElementById("aa");
     aa.style.backgroundImage ="url(images/3.jpg)";
     c.style.backgroundColor="#6F3";
     b.style.backgroundColor="#CCC";
     a.style.backgroundColor="#CCC";
    }
    </script>

  • 相关阅读:
    中国剩余定理
    【BZOJ】【3053】The Closest M Points
    【BZOJ】【1878】【SDOI2009】HH的项链
    【BZOJ】【2648】SJY摆棋子&【BZOJ】【2716】【Violet 3】天使玩偶
    【UOJ Easy Round #2】
    【TYVJ 五月图论专项有奖比赛】
    【BZOJ】【3301】【USACO2011 Feb】Cow Line
    【BestCoder】【Round#41】
    【BZOJ】【1046】/【POJ】【3613】【USACO 2007 Nov】Cow Relays 奶牛接力跑
    【BZOJ】【3210】花神的浇花集会
  • 原文地址:https://www.cnblogs.com/a12110303043/p/5778535.html
Copyright © 2011-2022 走看看