I am using two scripts that fire at the same time. They seem to cause a conflict. The question I have is how can I get one to fire a half a second to a second after the other fires? I think that might solve the issue I am having.

I am using jQuery but I am unsure how to go about this.

Thanks

Note I did not post the scripts here a they are irreverent. I just need to know how to delay one from firing until the other has. Also the one I want to fire last is at the bottom of the HTML the other is in the head. Also the two scripts are pletely unrelated to each other in what they do.

EDIT This question stems from another question i posted. Here - Javascript/Fancybox Error? - I thought about it and would like to try to add a delay but I am also curious as how to add the delay anyway that is not related to the issue I am having.

I am using two scripts that fire at the same time. They seem to cause a conflict. The question I have is how can I get one to fire a half a second to a second after the other fires? I think that might solve the issue I am having.

I am using jQuery but I am unsure how to go about this.

Thanks

Note I did not post the scripts here a they are irreverent. I just need to know how to delay one from firing until the other has. Also the one I want to fire last is at the bottom of the HTML the other is in the head. Also the two scripts are pletely unrelated to each other in what they do.

EDIT This question stems from another question i posted. Here - Javascript/Fancybox Error? - I thought about it and would like to try to add a delay but I am also curious as how to add the delay anyway that is not related to the issue I am having.

• javascript
• jquery

• 3 If they're pletely unrelated in what they do, how are they conflicting? – icktoofay Commented Aug 5, 2011 at 2:46
• Looking at all the discussion, I will suggest you to explore web workers. – Kumar Commented Aug 5, 2011 at 3:06
• Web Workers? What do you mean? – L84 Commented Aug 5, 2011 at 3:07
• Next time, you would save everyone a lot of time if you just said you have two fancyBox things and you want to make sure one runs after the pletion of the other. Your initial post had absolutely nothing in it about that library and that is required information in order to solve your problem. I'm done here. – jfriend00 Commented Aug 5, 2011 at 3:28
• Actually only one of the scripts is Fancybox the other is not. I originally was asking how to delay firing of a script and thought it might solve a problem I had posted about in another post. I apologize if I worded anything badly. I also thank you for any help you offered. – L84 Commented Aug 5, 2011 at 3:37

4 Answers 4

If you want fancybox to run first, use the fancybox onComplete callback:

$j(document).ready(function(){
    $j('#start').fancybox({

        'onComplete': function () {
            Engine.Initialize();
        }

    });
});

otherwise, put the fancybox code in after calling your custom init function:

$j(document).ready(function(){
    Engine.Initialize();

    $j("#start").fancybox({
        'padding' : 0
    });
});

Two scripts cannot fire at the same time. Javascript is single threaded and no two scripts ever run at the same time. One will run to pletion, then the next one will run. If there is a conflict between the two, then it has to do with how the scripts are written and we could only help you solve that problem by seeing the scripts and the context that causes them to run.

Also, it may be relevant that anything you attempt to run in the head tag when the script is loaded cannot manipulate the browser DOM because it is not in place yet. It would have to be delayed until the DOM is successfully loaded and ready for manipulation.

It is easy to have one javascript function call another javascript function:

function doStuff1() {
    // do doStuff1 stuff
    doStuff2();
}

function doStuff2() {
    // do doStuff2 stuff
}

doStuff1();   // call doStuff1 which will also call doStuff2

You've now added one more part of your question. You ask how to implement a delay. You can use a timer to run some code at some time in the future:

setTimeout(doStuff2, 5000);    // run doStuff2() in 5 seconds

jfriend00's post is correct, but the following does exactly what you are asking for:

// Ensure that all scripts have been loaded.
$(document).ready(function(){

    // Call first script.
    doFistThing();

    // Set a 1 second delay that starts AFTER the first script has pleted.
    setTimeout(function(){

        doSecondThing();

    }, 1000);


});

I am not sure how totally unrelated scripts can affect each other, may be these un related scripts are affecting global properties which they use and hence go bonkers. There is a concept in JS that let you run two JS scripts in parallel, this is known as web workers. John Resig, the jquery guy, have published an article long ago and I found it using Google. http://ejohn/blog/web-workers/. Using web worker you can start your 2nd script after one second or any time. I am not a JS ninja but I think it may help you. But still, w/out you posting your code it is hard for others to suggest you something. After looking at your edit, I can suggest you to explore settimeout in JS. Another link from same article http://ejohn/blog/how-javascript-timers-work/