I have a pretty simple issue here but not sure what to do.
I have a div that I want to fade in on a page so in order to do that, it has to be set to display:none first but, I want to do that in jquery, not css.
The reason is that in the rare chance that the visitor has js tuned off, well then the div would never show up at all if the css had display none. So I set the jquery to change the display to "none" and then after that, fade in the same div.
The problem is that when you load the page, for a split second, you see the div ( before it renders the display:none") and then it fades in. It looks kind of buggy.
Is there a way to avoid this issue? I don't want to set display:none in the css.
To be honest, I have seen a ton of high end sites that use a lot of jquery and you would think they would know to set it up this way. You turn off js and the entire site never gets to display at all. that is definitely a wrong approach and very risky.
Is there a simple way to fix this? Here is my simple JS
The "display:none" just doesnt trigger fast enough and you see the content for a split second.