5

我制作了一个非常快速的 jQuery 幻灯片，我正在使用它来隐藏在轮到他们之前不应该显示的 DIV：

$(document).ready(function() {
  //Hide All Div's Apart From First
  $('div#gall2').hide();
  $('div#gall3').hide();
  $('div#gall4').hide();

但是在加载页面时，您可以看到 DIV 的 gall2 gall3 和 gall4 在它们被隐藏之前的一瞬间。

在我的 CSS 中添加是否可以：

#gall2, #gall3, #gall4{ display:none;}

这将解决他们在一瞬间显示的问题，只是想知道它是否可以接受

4

5 回答 5

15

在 CSS 中禁用很好，但是没有 JS 的用户将永远看不到它们。

要仅对使用 JS 的用户禁用，请标记正文和适当的 CSS：

<body>
  <script type="text/javascript">
    document.body.className += " js";
  </script>

CSS：

.js #gall2, .js #gall3, .js #gall4 { display: none; }
于 2009-12-06T17:50:56.927 回答
2

是的，在你的 CSS 中这样做当然是可以接受的

其他答主是对的。让事物只在 JS 中可见并不是一个好习惯。我想我只是在技术上思考：以这种方式更改您的 CSS 将解决问题。

于 2009-12-06T17:44:27.543 回答
2

作为 orip 答案的替代方案，如果您不喜欢在 中添加脚本，可以执行以下操作<body>：

<html>
<head>
  <script src="jquery.js"></script>
  <script>
    $('html').addClass('js');
    $(function() {
      // do DOM ready stuff
    });
  </script>
  <style>
  .js #gall2, .js #gall3, .js #gall4 { display: none; }
  </style>
</head>

您将避免以这种方式闪烁，因为您在DOM 准备好之前将类名添加到 HTML。

于 2009-12-06T18:32:21.180 回答
0

总是试着想象关闭 JS 的用户会看到什么。如果您使用 CSS 解决方案，非第一个 DIV 也不会显示给他们，但如果您以编程方式更改幻灯片，他们显然只会看到第一个。最好给他们一个“No JS”选项。然后，如果您可以确定用户启用了 JS，您可以使用 CSS 隐藏 div 并使用 JS 显示它们。

于 2009-12-06T17:45:48.900 回答
0

之所以显示它们，是因为默认情况下可能会设置为显示 div。由于在页面上触发“就绪”事件可能需要几秒钟，所以在页面上的所有内容都加载并准备好之前，不会触发 .hide() 方法调用。

如果我没记错的话，.hide() 方法只会将元素的“display”属性设置为“none”。因此，默认情况下，通过 CSS 将 div 设置为隐藏允许它们始终隐藏，并且您可以获得额外的好处，即没有 JS 的用户也看不到它们。

于 2009-12-06T19:58:35.407 回答