當(dāng)前位置:首頁(yè) > IT技術(shù) > Web編程 > 正文

jQuery顯示隱藏效果
2022-04-18 11:00:00

顯示語(yǔ)法規(guī)范

顯示參數(shù)

1.參數(shù)都可以省略,無(wú)動(dòng)畫(huà)直接顯示。

2.speed :三種預(yù)定速度之一的字符串(“slow”, "normal”",or“fast”)或表示動(dòng)畫(huà)時(shí)長(zhǎng)的毫秒數(shù)值(如:1000)

3.easing : (Optional)用來(lái)指定切換效果,默認(rèn)是“swing”,可用參數(shù)“l(fā)inear”.

4.fn:回調(diào)函數(shù),在動(dòng)畫(huà)完成時(shí)執(zhí)行的函數(shù),每個(gè)元素執(zhí)行一次。

代碼示例(包含隱藏):

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
        div {
            height: 400px;
            width: 138px;
            background-color: pink;
        }
    </style>
</head>

<body>
    <button>顯示</button>
    <button>隱藏</button>
    <button>切換</button>
    <div></div>
</body>
<script src="/js文件/jQuery.mini.js"></script>
<script type="text/javascript">
    $(function () {
        //顯示
        $("button").eq(0).click(function () {
            $("div").show(1000, function () {
                alert(1)
            });
        })
        //隱藏
        $("button").eq(1).click(function () {
            $("div").hide(1000, function () {
                alert(1)
            });
        })
        //切換
        $("button").eq(1).click(function () {
            $("div").toggle(1000)
        })
        //一般情況下我們都不加參數(shù)直接顯示隱藏就可以了
    })
</script>

</html>

?

本文摘自 :https://www.cnblogs.com/

開(kāi)通會(huì)員,享受整站包年服務(wù)立即開(kāi)通 >