3gwebtrain
3gwebtrain

Reputation: 15303

Why my jquery plugin doesn't working?

I am making a plug-in, but i am not getting any result, if i put console inside the function, in case if i place it out it works.

what is the issue? any one can help me to find out?

my code :

(function ($){
    $.fn.slideIt = function () {
        this.fadeOut('normal', function(){
            console.log(this);
        });

}
})(jQuery);

Here is the fiddle

Upvotes: 1

Views: 96

Answers (3)

user659025
user659025

Reputation:

You're breaking "the magic of jQuery". The plugin should look like this:

(function($) 
{
    $.fn.slideIt = function()
    {
        return this.each(function()
        {
            $(this).fadeOut('normal', function()
            {
                console.log($(this));
            });
        });
    }
})(jQuery);

$('#slideContainer').slideIt();​

Otherwise you wouldn't be able to do things like $('#slideContainer').slideIt().fadeIn("slow").

Working demo here.

Upvotes: 0

webdeveloper
webdeveloper

Reputation: 17288

Use document ready event, your div not exist when your call plugin:

$(function(){
    $('#slideContainer').slideIt();
});

Demo: http://jsfiddle.net/RW8R3/2/

Upvotes: 0

gen_Eric
gen_Eric

Reputation: 227310

Your jsFiddle was made incorrectly. The HTML box should only contain HTML, put your JavaScript in the JavaScript box.

The problem was, you were calling slideIt before it was declared.

Here's an updated example: http://jsfiddle.net/RW8R3/1/

Upvotes: 1

Related Questions