0

Dom on mobile phones are slow, and many jQuery functions are even slower. My problem is that when I use a slow jQuery function after a dom function, the dom is loaded after jQuery.

An example:

function() {
    element.style.backgroundColor = somethingnew;   //this is loaded in the end
    alert('YOLO!');                                 //this is loaded first
}

But the Javascript engine starts width alert() and ends width the dom. That means the engine is loading in the WRONG ORDER! :(

How can I load the alert function or whatever I want AFTER the dom is loaded?

Alex

Jonan
  • 2,485
  • 3
  • 24
  • 42
alexvillaro
  • 15
  • 4

1 Answers1

0

The reason your element.style.backgroundColor=somethingnew; is loading last is because the DOM is not ready. Since you have no check for ready before running your function, it simply skips the beginning, completes the second part of the function alert("YOLO!");, then goes back to the beginning once the DOM is loaded and executes.To fix this, use

$(window).bind("load", function() { element.style.backgroundColor = somethingnew; alert("YOLO!"); });

Sabolis
  • 327
  • 1
  • 3
  • 13
  • Thanks for your comment very much. I think your idea is right, but when i load the page, the alert box pop up before the css is loadet, and the somethingnew style still apear after some seconds. – alexvillaro May 23 '14 at 16:46
  • I have used setTimeout width 100 ms. Its nor optimal but i works. Is there another callback after the dom is changed? – alexvillaro May 24 '14 at 12:56
  • There is no cross-browser way to do that. Not only that but it's really clunky, but if you're interested this guy wrote a pretty good answer. http://stackoverflow.com/questions/3219758/detect-changes-in-the-dom – Sabolis May 25 '14 at 18:06