要使用jQuery实现ColorBox的自动关闭,您可以在初始化ColorBox时设置close
选项为false
。然后,您可以使用afterOpen
回调函数来设置一个定时器,在指定的时间后关闭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); // 设置自动关闭的时间,单位为毫秒(这里设置为3秒)
}
});
});
</script>
</body>
</html>
在这个示例中,当您点击“Open ColorBox”链接时,ColorBox将打开,并在3秒后自动关闭。您可以根据需要调整setTimeout
函数中的时间值。