jquery 效果

来源:互联网 发布:java时间格式hhmmssnnn 编辑:程序博客网 时间:2024/04/29 15:55
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <style>        div{            width: 100px;            height: 100px;        }        #div1{            background-color: green;        }        #div2{            background-color: #ffa24a;            display: none;        }        #div3{            background-color: #ff231e;        }    </style></head><body><div id="div1"></div><div id="div2"></div><div id="div3"></div><script src="js/jQuery-2.2.2-min.js"></script><script>    /*隐藏元素hide(毫秒)  "slow" "normal" "fast"*/    //$("#div1").hide("fast");    /*显示内容:改变宽和高,最后显示全部*/    /*$("#div2").show(2000,function(){        alert("ok");    });*/    /*以滑动的方式显示和隐藏起来*/    /*$("#div2").slideDown(2000);    $("#div1").slideUp(2000);*/    /*显示的时候就隐藏起来,隐藏的显示出来*/    //$("#div2").slideToggle(2000);    /*fadeIn():通过改变透明度的方式显示出来*/    $("#div2").fadeIn(2000);    /*fadeout()*/    $("#div1").fadeOut(2000);    /*delay():设置某个动作延时执行*/    $("#div3").fadeOut(2000).delay(1000).fadeIn(2000);</script></body></html>

0 0
原创粉丝点击