4 Replies - 3301 Views - Last Post: 19 February 2011 - 10:07 PM

#1 dameon51  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 73
  • Joined: 07-June 10

createElement("link") onload?

Posted 19 February 2011 - 10:49 AM

I want to run a javascript function when the css I add through the DOM is finished loading. onload doesn't seem to be cutting it. It doesn't seem to work in firefox, and in IE it seems to run the javascript when the tag itself is created, not when the actual css is loaded.

Any ideas?
Is This A Good Question/Topic? 0
  • +

Replies To: createElement("link") onload?

#2 Martyr2  Icon User is offline

  • Programming Theoretician
  • member icon

Reputation: 4332
  • View blog
  • Posts: 12,127
  • Joined: 18-April 07

Re: createElement("link") onload?

Posted 19 February 2011 - 11:15 AM

Can you show us what you are trying to do? I have never needed to wait for CSS to load to run Javascript. This is because usually CSS applies to a given element and its that elements existence that I care about, now how it looks. Perhaps you can provide us an example of what you are doing. Javascript typically doesn't wait on presentation styling.

That or you have the Javascript do the styling as it goes. Either way, an example of what you are doing would help. :)
Was This Post Helpful? 0
  • +
  • -

#3 dameon51  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 73
  • Joined: 07-June 10

Re: createElement("link") onload?

Posted 19 February 2011 - 11:25 AM

Well my companies cms is ajax driven, and we just load the appropriate js and css with each page.

For the page transitions we fade the content body out, load in the new html, load the js and css, then fade the content body back in.

What I want to do is wait until the css has actually loaded until I fade the content back in, other wise the transitions don't always look so good.
Was This Post Helpful? 0
  • +
  • -

#4 Martyr2  Icon User is offline

  • Programming Theoretician
  • member icon

Reputation: 4332
  • View blog
  • Posts: 12,127
  • Joined: 18-April 07

Re: createElement("link") onload?

Posted 19 February 2011 - 01:23 PM

I assume you are doing something like...

var csslink = document.createElement("link");
csslink.setAttribute("rel", "stylesheet");
csslink.setAttribute("type", "text/css");
csslink.setAttribute("href", "somefile.css");

document.getElementsByTagName("head")[0].appendChild(csslink);



In which case all you need to do is put the Javascript you want to kick off after the appendChild call. This should work fine given that the CSS isn't loading some kind of complex backgrounds that you are relying on. There is no "On CSS load" event that I am aware of. I guess one work around you could do would be to setup a repeating timeOut to check for a certain style and if it is not set, have it reset the timeOut again until it detects the style. You should be able to do what you like with either of these two setups.

:)
Was This Post Helpful? 0
  • +
  • -

#5 dameon51  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 73
  • Joined: 07-June 10

Re: createElement("link") onload?

Posted 19 February 2011 - 10:07 PM

Surfing around online someone had the clever idea of refreshing the innerhtml of a style tag with ajax, so I went with that since I can run my fade in function when the ajax is done.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1