Clever Geek Handbook

Add animation to jQuery

I did some custom animation:

$(this).animate({opacity: '0'}, 200, function() {
    $(this).animate({height: '0'}, 200, function() {
        $(this).remove();
    });
});

Is there a way to add it to a jQuery function so that I can call it like fadeOut () or slideIn ()?

+3


source to share


2 answers


What do you want to do in all jQuery plugins . The idea is to add your function to prototype

jQuery to be aliased as $.fn

. You do it like this:



$.fn.myFadeOut = function(){
    return this.animate({opacity: '0'}, 200, function() {
        $(this).animate({height: '0'}, 200, function() {
            $(this).remove();
        });
    });
}
+1


source


You can create your own jQuery function using the property fn

:

$.fn.removeElement = function() {
    return this.each( function() {
        $(this).animate({opacity: '0'}, 200, function() {
            $(this).animate({height: '0'}, 200, function() {
                $(this).remove();
            });
        });
    });
};


Using:

$( '#someElement' ).removeElement();
0


source






More articles:


All Articles