-1

I have write a jQuery CLICK event, in that event there are two codes which will be executed after click the event but I want to finish the first code execution first then after finish it start execution of the second code. But now they both are executing at the same time when the CLICK event is triggered.

The first code is about slideUp, so I want to complete the slideUp first then start the execution of second code. Here is the Fiddle

I have attached the code and image both here, please check and help me if you can. 

$(".team-item-area").on('click', function(){
        $(this).siblings().find('.team-item-right-para').slideUp();
        $(this).find(".team-item-right-para").slideToggle(function(){
            var check = $(this).is(":visible");

            if(check == true)
            {
                $(this).parents('.team-item-area').siblings().find('img').hide();
                $(this).parents('.team-item-area').find("img").fadeIn();
            } else {
                $(this).parents('.team-item-area').find("img").show();
                $(this).parents('.team-item-area').siblings().find('img').fadeIn();
            }
        });


    })[enter image description here][1]
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
Akib Hossain
  • 45
  • 6
  • 1
    [RTFM](http://api.jquery.com/slideup/#slideUp-duration-complete). `slideUp()` accepts an `onComplete` callback parameter. – BenM Aug 17 '17 at 15:54
  • Possible duplicate of [jQuery - Wait till end of SlideUp()](https://stackoverflow.com/questions/1084392/jquery-wait-till-end-of-slideup) – ednincer Aug 17 '17 at 21:15

3 Answers3

0

According to the documentation the slideup function has a second argument that is the function that will be called once the animation is complete. The first argument is the duration of the slide. You can set as you want (400 is the default)

$(this).siblings().find('.team-item-right-para').slideUp(400, function {
   ... code to execute after the slide is complete...
});
ednincer
  • 931
  • 8
  • 15
0

Use slideToggle method inside this you can right anything after completing http://api.jquery.com/slidetoggle/

laxman kanhere
  • 53
  • 8
0

Either use the solution @BenM mentioned or use somethin like this:

$(this).find(first operation)
    .delay(1)
    .queue(function (next) {
        $(this).find(second operation);
        next();
});