zoukankan      html  css  js  c++  java
  • 鼠标悬停和移除的变化(红变绿)

    鼠标悬停和移除

    效果图

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style>
                #div1{
                    width:100px;
                    height:100px;
                    background-color:red;
                    border-radius:20px;
                    margin:0 auto;
                }
                    
                
                
                
            </style>
        </head>
        <body>
            <div id="div1" onmouseover="toGreen()" onmouseout="toRed()"></div>
            <script>
                function toRed()
                {var x=document.getElementById("div1");
                    x.style.width="100px";
                    x.style.height="100px";
                    x.style.backgroundColor="red";
                    x.style.borderRadius="20px";
                    
                    
                }
                
                function toGreen()
                {var v=document.getElementById("div1");
                 v.style.width="300px";
                 v.style.height="300px";
                 v.style.backgroundColor="green";
                 v.style.borderRadius="30px";
                    
                    
                    
                }
                
                
                
            </script>
            
        </body>
    </html>

    鼠标悬停onmouseover在红色上面,变成绿色,鼠标移开onmouseout变红色

  • 相关阅读:
    导出预设体的缩略图工具
    FairyGui自动生成Wnd工具(Unity)
    Unity骨骼优化(转)
    顶点处理机制
    面向对象
    文件读取
    协同程序
    元表
    模块与包
    Lua表
  • 原文地址:https://www.cnblogs.com/hsl541/p/13245943.html
Copyright © 2011-2022 走看看