• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 272
  • Last Modified:

How do I queue two jQuery functions?

Hi,

I have a working two working lines of code and I would like line one to execute first and as soon as that is over I would like line two to execute:

line 1:
 
$("#sitedivs div:eq("+k+")").animate({"left": $("#sitedivs div:eq("+k+")").position().left+$(window).width()+"px"}, {queue:false, duration: 1500,specialEasing: {left: "easeInOutExpo"}

Open in new window


line 2:
 
$("#sitedivs div:eq("+i+")").css("left", i*$(window).width()+"px" );

Open in new window


How do I queue these two functions?

thanks in advance




p.s. I was hoping to achieve something like another of my working codes which looks like this (this is just an example of what I am trying to achieve)
 
jQuery("#animazioneIntroContainer").fadeTo(1000, 1.0, 
    function() { jQuery("#animazioneIntroA").fadeOut(2000, 
        function() { jQuery("#animazioneIntroB").fadeOut(2000
        ); 
    });
});

Open in new window

0
badwolfff
Asked:
badwolfff
  • 3
  • 2
1 Solution
 
Kyle HamiltonData ScientistCommented:
you can supply a callback function. Basically it would look something like this, but without more context, I don't know if this will work (need to define k and i)

 
$("#sitedivs div:eq("+k+")").animate({ 
                                      "left": $("#sitedivs div:eq("+k+")").position().left+$(window).width()+"px"
                                      }, {
                                            duration: 1500, 
                                            specialEasing: {
                                                left: "easeInOutExpo"
                                                },
                                            queue: false
                                            }, 
                                            complete: function() {
                                                $("#sitedivs div:eq("+i+")").css("left", i*$(window).width()+"px" );
                                            }
                                        });

Open in new window


more here: jquery animate
0
 
badwolfffAuthor Commented:
Hi there seems to be some error in the code somewhere but I can't locate it.
When I paste it in dreamweaver it says error on line 10, i.e.

complete: function() {


any ideas?
0
 
Kyle HamiltonData ScientistCommented:
try it without the "complete" label:

so instead of:

complete: function() { .....

just:

function() { .....

However, I've had issues using the callback this way. Try these out to see if they'll work:

1.:

 
$("#sitedivs div:eq("+k+")").animate({ 
                                      "left": $("#sitedivs div:eq("+k+")").position().left+$(window).width()+"px"
                                       }, 1500, "easeInOutExpo", function() {
                                                $("#sitedivs div:eq("+i+")").css("left", i*$(window).width()+"px" );
                                            }
                                        });

Open in new window


OR 2:

 
$("#sitedivs div:eq("+k+")").animate({ 
                                      "left": $("#sitedivs div:eq("+k+")").position().left+$(window).width()+"px"
                                      }, {
                                            duration: 1500, 
                                            specialEasing: {
                                                left: "easeInOutExpo"
                                                }
                                            }, 
                                            complete: function() {
                                                $("#sitedivs div:eq("+i+")").css("left", i*$(window).width()+"px" );
                                            }
                                        });

Open in new window


I found I wasn't able to use "queue" with a call back - not sure why.

Hope this helps.
You can always check out http://api.jquery.com/animate/ for documentation.
0
 
badwolfffAuthor Commented:
I will test them tonight and send you a reply
thanks so much
0
 
badwolfffAuthor Commented:
The first solution works like a charm!
thanks so much!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Introducing Cloud Class® training courses

Tech changes fast. You can learn faster. That’s why we’re bringing professional training courses to Experts Exchange. With a subscription, you can access all the Cloud Class® courses to expand your education, prep for certifications, and get top-notch instructions.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now