当页面内容被操纵时停止javascript闪烁？

当我制作具有操作页面的javascript的网站时，这种操作发生在页面加载时，我经常会遇到令人讨厌的闪烁效果。当页面内容被操纵时停止javascript闪烁？

例如，如果我有一个手风琴，完整的内容将需要加载为html，然后一旦加载它可以用javascript包装。这意味着一段时间内可以看到全部内容，然后它会“闪烁”，因为其中一些内容被隐藏起来。

一个解决方案是用CSS隐藏任何闪烁的内容，然后用javascript显示它（必要时）。问题是，那么页面将无法正常工作，没有JavaScript的人。

有没有更好的方法？谢谢

2011-06-28 Evans

你正在使用什么事件来初始化你的JavaScript？它是否加载？ – rciq

我觉得正常的做法，这是尽快添加一个“JS”类的身体尽可能：

<!doctype html> 
... 
<body> 
<script>document.body.className='js';</script>

你会再采取一些CSS规则，以确保内容被隐藏在JS可用，就像是。

.js .accordion:nth-child(n+1) { display: none }

来源

2011-06-28 11:12:35 searlea

这绝对是最好的解决方案。 jQuery的ready函数等待DOM完全准备好。如果你想快速执行一个元素，那么这是我想要的方式。 –

一个不错的方法是使用document ready function in Jquery。

来源

2011-06-28 11:09:39

退房this excellent article保罗爱尔兰 - 它基本上是你所描述的方法的反转，用CSS隐藏，直到JS负荷。通过将<script>document.documentElement.className += 'js';</script>添加到头部，您基本上可以获得在DOM准备好之前隐藏未格式化内容的好处，并且对于没有使用Javascript的用户也不会搞砸。

来源

2011-06-28 11:12:39

如果您在页面加载后更改css属性，将发生这种闪烁。最好的方式来使CSS具有JavaScript处理它的相同的属性。通过这种方式，您还可以通过在浏览器中跳过额外的回流/重绘来使页面更高效。然而，黑客应该已经将JavaScript最小化并在你的css载入行之前加载它。

来源

2011-06-28 11:13:25

-1

没有更好的方法来做到这一点，使用渐进式增强。在某些时候，您将需要加载整个页面，然后使用JavaScript来隐藏您不想看到的内容。但是，因为JavaScript只能在DOM写完后才能执行，所以必须先等待它被写入，然后才能隐藏它。这似乎违反直觉，但你去了。这是我们支付操纵DOM的价格:-)

来源

2011-06-28 11:13:25 Alex

当页面内容被操纵时停止javascript闪烁？

回答

相关问题