Home/ Questions/Q 992357
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T06:15:18+00:00

I have a specific example, but I’m looking for the answer in general as

  • 0

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:

  1. A section of a form that toggles
  2. 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;
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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

    • 0