1

为什么一段时间后字幕会消失？目前，如果用户不做任何事情，窗口标题会在一段时间后消失。

如何阻止字幕始终可见？

任何想法我都是fancybox3的新手。

<!doctype html>
<html>
<head>
	<title>fancyBox - touch enabled, responsive and fully customizable lightbox script</title>

	<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0">
	<meta content="text/html;charset=utf-8" http-equiv="Content-Type">

	<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700|Open+Sans:400,700" rel="stylesheet" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.1.20/jquery.fancybox.min.css">
	<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.1.20/jquery.fancybox.min.js"></script>

<body>
	<div class="hidden">
        <a data-fancybox="cl-group" data-caption="zaid 1" data-thumb="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_m.jpg" href="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_b.jpg"><img src="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 2" data-thumb="http://farm8.staticflickr.com/7404/12868632153_b0a5718c22_m.jpg" href="http://farm8.staticflickr.com/7404/12868632153_b0a5718c22_b.jpg"><img src="http://farm8.staticflickr.com/7404/12868632153_b0a5718c22_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 3" data-thumb="http://farm6.staticflickr.com/5584/15276294205_5a7ffe793c_m.jpg" href="http://farm6.staticflickr.com/5584/15276294205_5a7ffe793c_b.jpg"><img src="http://farm6.staticflickr.com/5584/15276294205_5a7ffe793c_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 3" data-thumb="http://farm8.staticflickr.com/7412/8732133694_0c7e400022_m.jpg" href="http://farm8.staticflickr.com/7412/8732133694_0c7e400022_b.jpg"><img src="http://farm8.staticflickr.com/7412/8732133694_0c7e400022_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 4" data-thumb="http://farm3.staticflickr.com/2870/8985207189_01ea27882d_m.jpg" href="http://farm3.staticflickr.com/2870/8985207189_01ea27882d_b.jpg"><img src="http://farm3.staticflickr.com/2870/8985207189_01ea27882d_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 5" data-thumb="http://farm4.staticflickr.com/3677/8962691008_7f489395c9_m.jpg" href="http://farm4.staticflickr.com/3677/8962691008_7f489395c9_b.jpg"><img src="http://farm4.staticflickr.com/3677/8962691008_7f489395c9_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="zaid 6" data-thumb="http://farm8.staticflickr.com/7353/8998818196_ec7c900bf6_m.jpg" href="http://farm8.staticflickr.com/7353/8998818196_ec7c900bf6_b.jpg"><img src="http://farm8.staticflickr.com/7353/8998818196_ec7c900bf6_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption=" (dSavin)" data-thumb="http://farm4.staticflickr.com/3745/8971419780_cb88b22947_m.jpg" href="http://farm4.staticflickr.com/3745/8971419780_cb88b22947_b.jpg"><img src="http://farm4.staticflickr.com/3745/8971419780_cb88b22947_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="The Trail (Msjunior-Check out my galleries)" data-thumb="http://farm9.staticflickr.com/8481/8215602321_69d9939b8b_m.jpg" href="http://farm9.staticflickr.com/8481/8215602321_69d9939b8b_b.jpg"><img src="http://farm9.staticflickr.com/8481/8215602321_69d9939b8b_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="First light (Jan Linskens)" data-thumb="http://farm9.staticflickr.com/8349/8225268620_4e00a8f603_m.jpg" href="http://farm9.staticflickr.com/8349/8225268620_4e00a8f603_b.jpg"><img src="http://farm9.staticflickr.com/8349/8225268620_4e00a8f603_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="Color of Autumn (fukui_norisuke)" data-thumb="http://farm9.staticflickr.com/8067/8219961599_be412f62dd_m.jpg" href="http://farm9.staticflickr.com/8067/8219961599_be412f62dd_b.jpg"><img src="http://farm9.staticflickr.com/8067/8219961599_be412f62dd_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="Assunção - Santo Tirso...a New Dimension... (Alex Matos)" data-thumb="http://farm8.staticflickr.com/7100/6917703112_d18e3e1b95_m.jpg" href="http://farm8.staticflickr.com/7100/6917703112_d18e3e1b95_b.jpg"><img src="http://farm8.staticflickr.com/7100/6917703112_d18e3e1b95_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="Cummeengeera Settlement/Rabachs Glen. (alancronin02)" data-thumb="http://farm8.staticflickr.com/7065/7058141285_064170310e_m.jpg" href="http://farm8.staticflickr.com/7065/7058141285_064170310e_b.jpg"><img src="http://farm8.staticflickr.com/7065/7058141285_064170310e_m.jpg" alt=""></a>
        <a data-fancybox="cl-group" data-caption="1968 Dodge Charger R/T - Solaris (1968 Dodge Charger R/T)" data-thumb="http://farm6.staticflickr.com/5333/7061356373_1af921fd78_m.jpg" href="http://farm6.staticflickr.com/5333/7061356373_1af921fd78_b.jpg"><img src="http://farm6.staticflickr.com/5333/7061356373_1af921fd78_m.jpg" alt=""></a>
    </div>
<script>
	
</script>
</body>
</html>

4

4 回答 4

6

默认情况下，字幕会在 4 秒后消失。要禁用此行为，请将idleTime选项设置为false：

$('.fancybox').fancybox({
    idleTime: false
});
于 2017-09-26T19:17:10.683 回答
2

在 CSS 中是可能的，只需添加

   .fancybox-caption{
        visibility: visible;
        direction: ltr;
        opacity: 1;
        position: absolute;
        z-index: 99997;
      }
于 2018-05-22T12:03:58.147 回答
1

您还可以 <a>使用数据选项控制标签的行为。

在上面的示例中，它将是：

<a data-fancybox="cl-group" data-options='{"idleTime" : "false"}' data-caption="zaid 1" data-thumb="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_m.jpg" href="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_b.jpg"><img src="http://farm9.staticflickr.com/8665/15613375844_99dc1e5dc0_m.jpg" alt=""></a>
于 2018-06-12T09:37:20.230 回答
0

如果有人面临这个问题，那么有一种方法可以直接处理标题，您需要更改花哨的盒子 JS 库。我只是从 JS lib 中删除了fancybox-caption类并全部修复。:) 找到fancybox-caption类并将其从 removeClass 函数中删除。

或添加

$('.fancybox').fancybox({
    idleTime: false
});
于 2017-07-18T02:14:45.507 回答