jQuery ईवेंट ऑर्डर और एनीमेशन पूर्ण होने तक प्रतीक्षा

Question

मेरे पास एक स्लाइडर एनीमेशन है लेकिन clX.click event #close div पर एनिमेटेड -250px छोड़ा जाने से पहले छिपा हुआ है। एनीमेशन पूर्ण होने तक प्रतीक्षा करें और फिर #close div को छुपाएं?

$(document).ready(function() { 
     $("#open").click(function() { 
      if ($("#close").is(":hidden")) { 
       $("#open").animate({ 
        marginLeft: "-32px" 
       }, 200); 

       $("#close").show(); 
       $("#close").animate({ 
        marginLeft: "250px" 
       }, 500); 
      } 
     }); 
     $("#clX").click(function() { 
      $("#close").animate({ 
       marginLeft: "-250px" 
      }, 500); 

      $("#open").animate({ 
       marginLeft: "0px" 
      }, 200); 

      $("#close").hide(); 
     }); 
    }); 

Answer 1

आप एनीमेशन में कॉलबैक फ़ंक्शन जोड़ सकते हैं। एक बार एनीमेशन समाप्त होने के बाद इसे निकाल दिया जाएगा।

$('#clX').click(function() { 
    $('#close').animate({ 
    marginLeft: "-250px" 
    }, 500, function() { 
    // Animation complete. 
    $("#close").hide(); 
    //i supose $this.hide() <br/>would work also and it is more efficient. 
    }); 
}); 

Answer 2

@hasan, मुझे मालूम होता @patxi मतलब $ (इस)

var closeable = $('#close'); 
$('#clx').bind('click', function(){ 
    // $(this) === $('#clx') 
    closeable.stop().animate({marginLeft:'-250px'},{ 
    duration: 500, 
    complete: function(){ 
     $(this).hide(); 
     // $(this) === closeable; 
    } 
    }); 
});