渐进增强和初始显示状态
我有一个具体的例子，但我也在寻找一般的答案。如果启用了 JavaScript，我希望最初隐藏一些页面元素。
示例：
- 表单的一部分，用于
- 切换选择框“跳转表单”的提交按钮
我试图在页面加载后隐藏元素时避免“内容闪烁”。
解决方案
为了后代，我将完整的解决方案放在这里。
部分中调用的 JavaScript 文件：document.documentElement.className = 'js';
允许最初隐藏或显示元素的样式：
.js .inithide {
display: none;
}
.initshow {
display: none;
}
.js .initshow {
display: block;
}
I have a specific example, but I'm looking for the answer in general as well. I have page elements that I want to have initially hidden if JavaScript is enabled.
Examples:
- A section of a form that toggles
- A submit button for a select box 'jump form'
I am trying to avoid the 'content flash' when the elements are hidden after page load.
SOLUTION
I am putting the full solution here for posterity's sake.
JavaScript file called in <head> section: document.documentElement.className = 'js';
Styles that allow for initially hidden or shown elements:
.js .inithide {
display: none;
}
.initshow {
display: none;
}
.js .initshow {
display: block;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
检查这个解决方案。它过去对我有用：
http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content
Check this solution out. It has worked for me in the past:
http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content