js的事件级动画效果

原创 2018-11-10 15:54:40 5
摘要:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><script type="text/javascript">        functio
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
        function getFocus(x) {
         x.style.background = "pink";
        }
        function loseBlur(){
         alert("失去焦点")
        }

        function change(){
         alert("改变内容")
        }

        function dianji(y){
         y.style.background="yellow";
        }
        function shuangji(a){
         a.style.borderRadius="50%";
        }
        function yijin(b){
         b.style.background="#00B0F0"
        }
        function yichu(c){
            c.style.background="#BF00BD"
        }
</script>
</head>
<body>
     
<input type="text" onfocus="getFocus(this)" onblur="loseBlur()" value="焦点"><br>
<input type="text" onchange="change()" value="改变内容">
<div style="width:100px;height:100px;background: blue;" onclick="dianji(this)">点击</div>
<div style="width:100px;height:100px;background: #E6E6E6;" ondblclick="shuangji(this)">双击</div>
<div style="width:100px;height:100px;background: #FBCFD0;" onmouseover="yijin(this)" onmouseout="yichu(this)">鼠标移进移出</div>
</body>
</html>


批改老师:韦小宝批改时间:2018-11-10 16:10:28
老师总结:一样的,下次记得加点总结进去!还有代码记得高亮!继续加油吧!

发布手记

热门词条