Question

我正在为我的博客制作一个Wordpress主题，我有一种叠加容器。如果你点击一个按钮，它会从顶部滑入并向下推动整个页面。

我使用jQuery，使用这个小代码：

$(document).ready(function () {

// variables
var overlay = $('#layout-overlay'); // Overlay ID

 // hide overlay-container
     overlay.css({
         display: 'block',
         marginTop: -overlay.height()
     });

...and more code...

正如您所看到的，我只是通过根据容器的高度指定负边距来隐藏容器，容器的高度本身取决于内容。

只要我把布局放在一起，一切都很好。现在我开始将它放入一个真正的Wordpress主题中，覆盖容器在页面加载和页面重新加载时可见，它包含在每个页面上。它可能只是几毫秒，但它显然是显而易见的。眨眼之间它已经消失，因为它应该是从一开始就消失了。

我有什么想法可以让整个事情重新定时吗？

我将JS放在<head>标记中，并确保它是第一个被解雇的代码。

Answer 1

如果您想摆脱毛刺，首先将叠加层的常规CSS设置为display: none。如果出现问题，请在使用load完全加载页面后尝试显示。

更多关于ready vs load的信息： jQuery - What are differences between $(document).ready and $(window).load?

隐藏div在重载时可见，jQuery计时

1 个答案: