run jquery before document is ready

Question

I have the following script:

$(document).ready(function() { $('*:lang(English)').hide(); $('*:lang(French)').hide(); });

What I need is that every element with attribute lang="English" or lang="French" to be hidden initially.

but now when I load my website it glitches. since html starts being rendered before $(document).ready becomes well "ready". So as a consequence all elements with the above specified attribute will be shown for a split second.

Is there a way to put a handler on every *:lang(English) before document is ready so I don't see anymore glitches?

Evan Hahn · Accepted Answer · 2013-03-15 02:56:28Z

2

You should probably remove the jQuery and do this with CSS:

*:lang(en), *:lang(fr) { display: none; }

Then, if you want to show only one language, for example, do that with jQuery.

$(document).ready(function() { $('*:lang(fr)').show(); });

answered Mar 15, 2013 at 2:56

Evan Hahn

12.8k10 gold badges44 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kam Over a year ago

Fantastic, that solved it....Quick question though, what is the difference between this and using visibility property?

Evan Hahn Over a year ago

visibility: hidden makes it invisible, but it still takes up space. display: none is as if it were never even there, taking up no space.

Collectives™ on Stack Overflow

run jquery before document is ready

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related