Running a script before the page is displayed

Issue

I’ve built a site that does a bunch of calculations as the page loads (basically it determines the users screen size, then assigns all of the page images sizes and positions and applies them). The problem I am having is on a slower connection, this is visible (all of the images will start in the corner, then resize and reposition). This isn’t a huge deal, but it’s kind of an eyesore.

I’m using jQuery to do this, and all the calculations are happening on $(document).ready, is there someway to do this before then? Or should I use a preloader? What’s a good one (queryLoader wasn’t working for me, and all the other ones I can find are all just for preloading images).

Any suggestions would be much appreciated!

Solution

If you’re just worried about the images, how about styling them to be invisible (display: none) until after they’ve been repositioned?

Answered By – Joe Enos

Answer Checked By – David Marino (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.