Question

I have a function call SwapOnscreenPhotos. Here is the source for that function:

function SwapOnscreenPhotos(currentPhotoSet, arrowClicked)
{
    $("#photo-list img").each(function(index) 
    { 
        $(this).attr("src", photoData[currentPhotoSet][index].url);

        if (photoData[currentPhotoSet][index].liked === true)
        {   
            $(this).addClass("liked");
        }
        else
        {
            $(this).removeClass("liked");
        }
    });

    //Animate the old photos off of the screen
    $("#match").hide("slide", { direction: "left" }, 1000);
}

I do some random things, and then at the end of the function, I want to call an effect on #match unconditionally. There is no event after which I want to execute this effect (if it matters, an event determines whether I call SwapOnScreenPhotos in the first place). How am I supposed to execute this effect?

EDIT:

Sorry, let me clarify myself. I had gotten the impression that every jQuery expression follows a similar formula. $('selector').event(function() { //function stuff});

My code $("#match").hide("slide", { direction: "left" }, 1000); deviates sharply from this example. My code more closely resembles the following model: $('selector').function. Notice that there is no event that dictates when my code should be executed and when it should not be executed. Is there a way to call jQuery functions without this event? When I try run the above code, I am given this error:

Uncaught TypeError: Property ‘#’ of object # is not a function jquery.js:8780
Tween.run jquery.js:8780
tick jquery.js:8491
jQuery.fx.timer jquery.js:9032
Animation jquery.js:8555
jQuery.fn.extend.animate.doAnimation jquery.js:8871
jQuery.extend.dequeue jquery.js:1894
jQuery.fn.extend.queue jquery.js:1937
jQuery.extend.each jquery.js:611
jQuery.fn.jQuery.each jquery.js:241
jQuery.fn.extend.queue jquery.js:1930
jQuery.fn.extend.animate jquery.js:8881
jQuery.each.jQuery.fn.(anonymous function) jquery.js:8853
AnimateMatch match.js:21
SwapOnscreenPhotos match.js:70
$.ajax.success match.js:167
jQuery.Callbacks.fire jquery.js:974
jQuery.Callbacks.self.fireWith jquery.js:1082
done jquery.js:7650
jQuery.ajaxTransport.send.callback

I assumed that this error was caused by my failure to specify an event. Does this make more sense?
Thank you

Answer 1

You’re trying to use the JQuery UI hide; this is the error message you get if the JQuery UI library hasn’t been loaded, and you’re instead working with plain JQuery.

For example, if I run your code on this (Stack Overflow) page using Firebug, then I get the same error.

$("body").hide("slide", { direction: "left" });

TypeError: Property ‘#’ of object # is not a function

---

So in summary, there’s nothing wrong with how you’re trying to call the function. I think the problem is that you’ve neglected to include the JQuery UI library, or it hasn’t been loaded correctly.