Take the 2-minute tour ×

Okey guys, so as the title says, i need some help about how i can create a Javascript and/or jQuery script which will 1st load all the html page elements (like divs etc.) and then display the page,once it is 100% loaded. I need this because right now, during the loading, one of my divs is moved up, and then when the page is loaded it goes into correct position. Cheers!

share|improve this question
This is a possible workaround, but wouldn't you rather have a solution to the problem you're covering up? –  Wesley Murch Oct 21 '11 at 6:10
Do you have any code now? Cheers! –  xdazz Oct 21 '11 at 6:11
I would recommend double checking the markup and CSS in general instead of doing what you asked. You'll be turning your website into a usability hell by relaying on JS to show the content of the entire website. –  Ben Oct 21 '11 at 6:12
In my opinion this is a problem that doesn't need to be fixed, since it is pretty normal for a lot of pages, and what you are asking may just cover up some other underlying issue with your code, but: how about wrapping your whole page in a div that has style="visibility: hidden" and then changing it to visible in the document.ready or onload handler? Or adding a first element that is an absolutely positioned div with z-index, size and position set such that it covers everything else, and then remove that div on document.ready. Or some other variation thereon. –  nnnnnn Oct 21 '11 at 6:13
@nnnnnn, no JS = blank page = bad SEO = bad usability = hell –  Ben Oct 21 '11 at 6:15
show 3 more comments

2 Answers

up vote 2 down vote accepted

You could do this by initially setting body's css display to none and show it on document.ready().



<body style="display:none">


share|improve this answer
If you're going to do this, better to hide it with javascript as well instead of CSS. I believe display:none will have some bad side effects in terms of usability and SEO... –  Wesley Murch Oct 21 '11 at 6:19
Well, I can't comment it enough, just don't rely on JS to show the entire content of the website. –  Ben Oct 21 '11 at 6:19
@Ben: As long as you hide and show with js, what's the difference? –  Wesley Murch Oct 21 '11 at 6:20
@WesleyMurch, none. Hiding with CSS and showing with JS (like this answer suggest) is a huge mistake, hiding with JS and showing with JS seems reasonable. –  Ben Oct 21 '11 at 6:28
@Ben, thank you for your previous answer (about CSS checking) You were right!!! There was the problem, thanks ! –  Moozy Oct 21 '11 at 6:31
show 2 more comments

You could use clientside templates to build your page, for example the excelent jQuery.template plugin.

Simply don't build the page on the server, but do it on the client instead :)

share|improve this answer
add comment

Your Answer


