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;
}
