寫作回調函數

Question

我使用jQuery寫這樣的事情：

$('#current_image').fadeOut(function(){ 
     $('#current_image').attr('src',newImage).show(); 
    }); 

這是可愛的，一旦淡出已經完成，嵌套位執行。

我想在這裏做我自己的功能，將取代fadeOut。我的函數是什麼樣的，以便這段代碼可以工作？

$('#current_image').customFadeOut(function(){ 
     $('#current_image').attr('src',newImage).show(); 
    }); 

Answer 1

的關鍵是剛好路過函數引用您定義的原型方法，並結合該傳遞函數$.animate或任何jQuery的動畫功能，你在內部使用。

HTML：

<div id="blah" style="color:#fff; opacity:1; background:black; height:50px; position:relative; ">fsdljfdsjfds</div> 
<a id="click" href="#">fjsd</a> 

JS：

$.fn.customFadeOut = function (callback) { 
    return $(this).animate({ 
     opacity: 0.25, 
     fontSize: "3em", 
     height: 'toggle' 
    }, 5000, function() { 
     callback.apply(this) 
    }); 

} 

$('#click').click(function() { 
    $('#blah').customFadeOut(function() { 
     alert('hi') 

    }) 

})​ 

Live Demo