鼠标悬停效果

程序员文章站 2024-03-04 08:23:17

...

鼠标悬停，点击效果

鼠标悬停效果


<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            button{
                border: 0;
            }
            img{
                margin: 50%;
            }
        </style>
        <script>
            function changeColor( str){
                document.getElementById("color").style.backgroundColor=str;
            }
            //笑
            function myOver(){
                document.getElementById("tp").src="img/haha.gif";

            }
            //哭
            function myOut(){
                document.getElementById("tp").src="img/cry.jpg";

            }

        </script>
    </head>
    <body id="color">
        <button onclick="changeColor('pink')">粉色</button>
        <button onclick="changeColor('orange')">橙色</button>
        <button onclick="changeColor('grey')">灰色</button>
        <button onclick="changeColor('lightgreen')">豆绿色</button>

        <div  onmouseover="myOver()" onmouseout="myOut()" style="float: left;">
            <img id="tp" src="img/cry.jpg" />
        </div>

    </body>
</html>

鼠标悬停效果

鼠标悬停，点击效果

鼠标悬停效果

Android UI设计系列之自定义SwitchButton开关实现类似IOS中UISwitch的动画效果（2）

Android UI设计系列之HTML标签实现TextView设置中文字体加粗效果（6）

Android UI设计系列之ImageView实现ProgressBar旋转效果（1）

Android UI设计系列之自定义Dialog实现各种风格的对话框效果（7）

动态生成table并实现分页效果心得分享

android-wheel控件实现三级联动效果

Android常用进度条效果分享

Android基于ListView实现类似Market分页加载效果示例

Android刮刮卡效果实现代码