/    Sign up×
Community /Pin to ProfileBookmark

Cleaning Up Messy Javascript on Page Load

Copy linkTweet thisAlerts:
Aug 29.2008

We’re rotating some elements using [URL=”http://medienfreunde.com/lab/innerfade/”]jquery + innerfade[/URL] on [URL=”http://studiocreek.com/client/synergy/test_1.0.html”]This Site[/URL] and you’ll see that when the page loads there is a small delay where you can see elements of the javascript slideshow that appear before they’re supposed to (The text on the top, and the image slideshow all look messy until the page has finished loading).

Is there a way to delay the calling of these elements or somehow adjust the page so it looks clean when the visitor first views the site?

to post a comment
JavaScript

1 Comments(s) ↴

Copy linkTweet thisAlerts:
@Declan1991Aug 29.2008 — (Using their example)

The only way to do that is to call the JavaScript immediately after the element is loaded, so$('#news').innerfade({ animationtype: 'slide', speed: 750, timeout: 2000, type: 'random', containerheight: '1em' }); $('#portfolio').innerfade({ speed: 'slow', timeout: 4000, type: 'sequence', containerheight: '220px' }); $('.fade').innerfade({ speed: 'slow', timeout: 1000, type: 'sequence', containerheight: '1.5em' });in a script tag directly after the last element referenced.

The page loads fast enough for me that I don't get that flash of content, but I'd suggest you avoid using the method I posted. Focus instead on getting the page to the user faster ([url=http://developer.yahoo.com/performance/]Yahoo Exceptional Performance[/url]).
×

Success!

Help @studiocreek spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...