溫馨提示×

ColorBox jQuery如何實現(xiàn)自動關(guān)閉

小樊
82
2024-10-23 16:48:23
欄目: 編程語言

要使用jQuery實現(xiàn)ColorBox的自動關(guān)閉,您可以在初始化ColorBox時設(shè)置close選項為false。然后,您可以使用afterOpen回調(diào)函數(shù)來設(shè)置一個定時器,在指定的時間后關(guān)閉ColorBox。以下是一個示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ColorBox Auto Close</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/colorbox/1.5.29/colorbox.min.css">
</head>
<body>
    <a href="https://example.com" class="colorbox">Open ColorBox</a>

    <script>
        $(document).ready(function() {
            $('.colorbox').colorbox({
                close: false,
                afterOpen: function() {
                    setTimeout(function() {
                        $('.colorbox').colorboxClose();
                    }, 3000); // 設(shè)置自動關(guān)閉的時間,單位為毫秒(這里設(shè)置為3秒)
                }
            });
        });
    </script>
</body>
</html>

在這個示例中,當您點擊“Open ColorBox”鏈接時,ColorBox將打開,并在3秒后自動關(guān)閉。您可以根據(jù)需要調(diào)整setTimeout函數(shù)中的時間值。

0