Create a callback for someone else's plugin

JavaScript
1

Hi there,

I am using the following plugin: http://www.thepixelart.com/demo/jticker/

It doesn’t however, accept a callback and I’m more of a mid-weight JQuery user so I was wondering if any of you ninjas can add one. I imagine you can do in a few minutes what I probably won’t be able to work out with hours of research.

thanks in advance

Silversurfer

2

What sort of callback do you want, and how do you intend to use it?

3

Hey Paul,

Well I am using the plugin in a very simple way because I only want it to happen once when the page loads. So I just use:


  jQuery("#ticker").ticker({
  type: "control",
	            item: 0,
	            rate: 10,
	            delay: 2000
	}).trigger("play").trigger("stop");

I want a function to be called when the stop event occurs this is so that I can perform some other animations. At the moment I am using delay(3000) before these other animations in order to stop the browsers trying to execute both the ticker and my secondary animations at the same time.

This is fine on newer browsers because I sorted out the bug that we discussed the other day and the ticker is flying along nicely but on IE7,8 sometimes the ticker takes longer than 3secs to finish which leads to the two effects executing simultaneously which slows the ticker and the other animation.

So I want to either pass Jticker a callback function or to add some sort of onstop event.

I would appreciate it if you are able to explain what you do to achieve this. I have had a go but I am not quite there yet. I don’t imagine it will take long as jticker isn’t a lengthy script.

thanks

Will

4

Well here’s the existing code for the stop piece:


.bind("stop", function(e){
    var data = elem.data(name);
    data.running = false;           
})

A callback function could be added, with:


.bind("stop", function(e, callback){
    var data = elem.data(name);
    data.running = false;
    if (callback && typeof(callback) === "function") {
        callback();
    }
})
5

I see what you’ve done, very sleek thanks very much :wink:

However , if I call it now even when I send it the name of the function to be called as below , the function is called before and not after the plugin is finished executing. I checked this with an alert and the alert happens rights away.

jQuery(“#ticker”).ticker({
type: “control”,
item: 0,
rate: 10,
delay: 2000
}).trigger(“play”).trigger(“stop”, myfunction);

6

Does anyone have any idea why this callback fires before and not after the plugin executes, is there something to do with the architecture of jTicker that I’m not seeing?

7

I have since found that things can’t work that way.

What may work though is instead of a callback, to just add another function to the ‘stop’ event.


jQuery("#ticker").on("stop", otherFunction);

That way when the stop event is triggered, the original function associated with it and your other function both get called.

8

Hey thanks for the suggestion Paul but that doesn’t do the trick either.

9

Well that’s odd - according to the on documentation it should work.
Perhaps by changing the event from #ticker to the body element instead?

10

Yes I had a read it should work fine but no luck or with the body tag either. I don’t think that it’s a standard event with this plugin. He calls trigger(“play”) and not jTicker(“play”). I am going to try to work out what it does by looking at the plugin as a whole but I have only written one plugin before so it takes me a long time to understand them. Thanks anyway.