CODEWITHSUNDEEP
javascriptjquery
L84
L84

Reputation: 46318

Have a script fire after another script?

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 completely 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.

Upvotes: 4

Views: 7439

Answers (4)

Samuel Liew
Samuel Liew

Reputation: 79113

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
    });
});

Upvotes: 5

Wayne
Wayne

Reputation: 501

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 completed.
    setTimeout(function(){

        doSecondThing();

    }, 1000);


});

Upvotes: 2

jfriend00
jfriend00

Reputation: 708036

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 completion, 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

Upvotes: 5

Kumar
Kumar

Reputation: 5147

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.org/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.org/blog/how-javascript-timers-work/

Upvotes: 1

Related Questions