gpt4 book ai didi

javascript - Bootstrap 在缓慢的页面加载时暂时显示隐藏的模态对话框

转载 作者:行者123 更新时间:2023-11-30 12:25:52 25 4
gpt4 key购买 nike

我在 Rails 应用程序中通过 bootstrap-sass-2.3.2.2 gem 使用 Bootstrap 2.3.2。

使用以下 HTML:

  <div class="modal hide fade fullscreen" id="myModal" aria-hidden="true">
<div class="modal-header">
<h3></h3>
</div>
<div class="modal-body">
<img src="">
</div>
<div class="modal-footer">
<a class="figureFullsizeLink btn" href="">Full-size</a>
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>

还有像这样的链接:

  <a href="#myModal" class="btn" data-toggle="modal" data-html="true">
<img alt="Fig 1" class="figure" src="http://s3.amazonaws.com/..." title="..." />
</a>

以及以下 javascript:

$(document).ready(function() {
...
// hide the modal window onload
$("#myModal").css("display", "none");
...
});

我在加载页面时看到打开的模式对话框的瞬间闪烁。 (有关示例,请参见 https://www.youtube.com/watch?v=X-HwRpKAUh8)。

最佳答案

您的 jQuery 代码在 DOM hierarchy has been fully constructed 之后运行.因此模态将在 DOM 加载时显示,然后 javascript 将执行并隐藏模态。

默认情况下隐藏模式的最简单方法是将 CSS 设置为:

#myModal{display:none};

或者,您始终可以将 jquery 代码放在

<head>

页面的元素,它将在构建 DOM 之前执行。

关于javascript - Bootstrap 在缓慢的页面加载时暂时显示隐藏的模态对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29403403/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com