jQuery淡出淡入

jQuery淡出淡入
　　淡入就是让元素按照指定的时间出现 (显示)
　　淡入就是让元素按照指定的时间隐藏

格式:
　　淡入: fadeIn(时间,函数)
　　淡出: fadeOut(时间,函数)
　　　　第二个参数:当元素淡入或者淡出完毕之后会自动触发该方法

ex:
html:

<style>
    div{
        height:200px;
        width:500px;
        background-color:green;
        margin-top:100px;
        margin-bottom:0;
        margin-left:auto;
        margin-right:auto;
        display:none;
    }
</style>
</head>
<body>
    <div>
    </div>
    <button type="button">淡入</button>
    <button type="button">淡出</button>
</body>

jq:

$(function(){
    $("button:eq(0)").click(function(){
        $("div").fadeIn(2000, function() {
            alert("div淡入完毕")
        });
    });
    $("button:eq(1)").click(function(){
        $("div").fadeOut(2000, function() {
            alert("div淡出完毕")
        });
    });
})

 

posted @ 2019-05-10 16:19  笑长不爱笑QvQ  阅读(177)  评论(0)  编辑  收藏  举报