diff --git a/README.md b/README.md index cd49af6..d598450 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ simple.carousel Copyright (c) 2012 Tobias Zeising, http://www.aditu.de Licensed under the MIT license -Version 0.3 +Version 0.3.1 This is a simple jQuery plugin for creating sliding carousels. @@ -15,7 +15,6 @@ Demo/Examples [aditu.de (image will change using a fade in/fade out effect)](http://www.aditu.de/)
[rsslounge (presentation of the features by an slideshow)](http://rsslounge.aditu.de/)
- Usage ----- @@ -63,7 +62,7 @@ Parameters parametertypeoutcome - wdithintwidth of the single frames + widthintwidth of the single frames heightintheight of the frames @@ -92,6 +91,9 @@ Parameters paginationintset true for this value and a pagination element will be included + + slideeventstringcustom event name fired when slide changes; see Slide Event example + @@ -107,4 +109,13 @@ $("#carousel").simplecarousel({ }); -Will create a carousel with fadein/fadeout effect. The pause between two frames will be 4 seconds, the speed of the fade effect will be 400 ms, the element with the class 'next' will be the next button (the same with 'prev' for back button). See download for further examples. \ No newline at end of file +Will create a carousel with fadein/fadeout effect. The pause between two frames will be 4 seconds, the speed of the fade effect will be 400 ms, the element with the class 'next' will be the next button (the same with 'prev' for back button). See download for further examples. + +Slide Event example +-------- +The following will log the current slide index and the direction. +
+$("#carousel").on('slide', function(e, config, dir){
+    console.log(config.current + ' ' + dir);
+});
+
\ No newline at end of file diff --git a/simple.carousel.js b/simple.carousel.js index 05badd2..bc962dc 100644 --- a/simple.carousel.js +++ b/simple.carousel.js @@ -21,7 +21,8 @@ $.fn.simplecarousel = function( params ) { items: 0, slidespeed: 600, visible: 1, - pagination: false + pagination: false, + slideevent: 'slide' //custom event name to be triggered }; var config = $.extend(defaults, params); @@ -59,7 +60,7 @@ $.fn.simplecarousel = function( params ) { }); // function for sliding the carousel - var slide = function(dir, click) { + var slide = this.slide = function(dir, click) { if(typeof click == "undefined" & config.auto==false) return; @@ -103,6 +104,9 @@ $.fn.simplecarousel = function( params ) { setTimeout(function() { slide('next'); }, config.auto); + + //fire a custom event on the original element, sends the current config and direction + ul.trigger(config.slideevent, [config, dir]); } // include pagination @@ -140,5 +144,6 @@ $.fn.simplecarousel = function( params ) { setTimeout(function() { slide('next'); }, config.auto); + return this; } })(jQuery); \ No newline at end of file