jQuery Smooth Div Scroll by Thomas Kahn

Back to index

Callbacks

For those of you who are new to javascript a callback is a function (A) that is passed as a parameter to another function (B). Typically the callback (A) is executed when the function (B) has finished doing whatever it was supposed to do. In jQuery you find lots of callbacks. If you for example animate something you can supply a callback that is executed after the animation is finished.

I know how much I love when plugin developers supply you with callbacks for major events in their plugins so I've added this as well.

If you want to hook on to a callback you need to write a function that responds to the callback. This function is added to the options when you initialize the plugin. It's sort of like regular options, but instead of values you supply functions. Here's an example of what it can look like:


$("#makeMeScrollable").smoothDivScroll({
	autoScrollingLeftLimitReached: function(eventObj, data) {
		alert("Autoscroll left limit reached.");
	}
});

In the example above I've chosen to hook on to the callback autoScrollingLeftLimitReached. All I do is throw up an alertbox, but you'd probably do other stuff in these functions.

Some of the callbacks pass back data that can be useful. Here's an example with a callback that passes back data:


$("#makeMeScrollable").smoothDivScroll({
	scrolledToElementId: function(eventObj, data) {
		alert("Scrolled to element id " + data["elementId"]);
	}
});

You don't have to write the whole function inline as a part of the option when initializing. You can write a separate function and just give its name when initializing. Just make sure that the function you write is "known" by the script before you initialize the plugin with its name - in most cases you have the function above the initialization code. An external/separate function as a callback can look like this:


var myFunction = function(eventObj, data) {
	alert("It's over!");
}

$("#makeMeScrollable").smoothDivScroll({
	mouseOverLeftHotSpot: myFunction
});

Manual scrolling callbacks

Auto scrolling callbacks

Jump to callbacks

Scroll to callbacks

Adding content callbacks

Miscellaneous callbacks

Back to index