fork me on github

Custom events

After the plugin has been fired, there are a series of custom events you can use to control the slider/gallery. To trigger these custom events, simply target the wrapper-element created by the plugin. For your convenience, this wrapper-element is returned by the plugin after it is fired.

var tos = $("#foo a").tosrus();
tos.trigger("open");


Event Datatype Description
open Opens the gallery (if it is not already opened).
(
index Number The slide to show.
Default value: The slide the gallery is currently at.
direct Boolean Whether or not to open the gallery immediately, without an animation.
Default value: false.
)
close Closes the gallery (if it is not already closed).
(
direct Boolean Whether or not to close the gallery immediately, without an animation.
Default value: false.
)
prev Slides the slider backward.
(
slides Number The number of slides to slide the slider.
Default value: The value for the prev.slides option.
direct Boolean Whether or not to move the slider immediately, without an animation.
Default value: false.
)
next Slides the slider forward.
(
slides Number The number of slides to slide the slider.
Default value: The value for the next.slides option.
direct Boolean Whether or not to move the slider immediately, without an animation.
Default value: false.
)
slideTo Slides the slider to the given slide.
(
slide Number (required) The index of the slide to move to.
direct Boolean Whether or not to move to the given slide immediately, without an animation.
Default value: false.
)


Callback events

In stead of adding callback-function to the configuration, the Tos "R"Us plugin triggers some custom events for you to hook into.

var tos = $("#links a").tosrus();
tos.bind("opening.tos", function( event ) {
	//	Your code here.
});


Event Datatype Description
opening Triggered when the gallery is opening.
(
index Number The slide that is shown.
direct Boolean Whether or not the gallery is opened immediately, without an animation.
)
closing Triggered when the gallery is closing.
(
index Number The slide that is shown.
direct Boolean Whether or not the gallery is closed immediately, without an animation.
)
sliding Triggered when the slider is sliding.
(
index Number The slide the slider is moving to.
direct Boolean Whether or not the slider is moved immediately, without an animation.
)
loading Triggered when the content of a slide is being loaded.
Note: This event is actually fired on the slide and will bubble up the DOM tree.
(
$anchor jQuery The anchor for the slide of which the content is being loaded.
)
loaded Triggered when the content of a slide is done loading.
Note: This event is actually fired on the slide and will bubble up the DOM tree.


Namespaces

To prevent interfering with other scripts, all custom events have been namespaced to ".tos", so triggering an event would best be done like this:

var tos = $("#foo a").tosrus();

tos.bind("opening.tos", function() {
   console.log( "Gallery just opened." );
});
tos.trigger("open.tos");