Added a custom event trigger on slide

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/)<br />
 [rsslounge (presentation of the features by an slideshow)](http://rsslounge.aditu.de/)<br />
 
-
 Usage
 -----
 
@@ -63,7 +62,7 @@ Parameters
     <th>parameter</th><th>type</th><th>outcome</th>
   </tr>
   <tr>
-    <td>wdith</td><td>int</td><td>width of the single frames</td>
+    <td>width</td><td>int</td><td>width of the single frames</td>
   </tr>
   <tr>
     <td>height</td><td>int</td><td>height of the frames</td>
@@ -92,6 +91,9 @@ Parameters
   <tr>
     <td>pagination</td><td>int</td><td>set true for this value and a pagination element will be included</td>
   </tr>
+  <tr>
+	<td>slideevent</td><td>string</td><td>custom event name fired when slide changes; see Slide Event example</td>
+  </tr>
 </table>
 
 
@@ -107,4 +109,13 @@ $("#carousel").simplecarousel({
 });
 </pre>
 
-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.
+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.
+<pre>
+$("#carousel").on('slide', function(e, config, dir){
+    console.log(config.current + ' ' + dir);
+});
+</pre>

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);