www/plugins/squelette_maparaan/js/jquery.s3slider.js

   1 /* ------------------------------------------------------------------------
   2         s3Slider
   3
   4         Developped By: Boban Karišik -> http://www.serie3.info/
   5         CSS Help: Mészáros Róbert -> http://www.perspectived.com/
   6         Version: 1.0
   7
   8         Copyright: Feel free to redistribute the script/modify it, as
   9                            long as you leave my infos at the top.
  10 ------------------------------------------------------------------------- */
  11
  12
  13 (function($){
  14
  15     $.fn.s3Slider = function(vars) {
  16
  17         var element     = this;
  18         var timeOut     = (vars.timeOut != undefined) ? vars.timeOut : 4000;
  19         var current     = null;
  20         var timeOutFn   = null;
  21         var faderStat   = true;
  22         var mOver       = false;
  23         var items       = $("#" + element[0].id + "Content ." + element[0].id + "Image");
  24         var itemsSpan   = $("#" + element[0].id + "Content ." + element[0].id + "Image span");
  25
  26         items.each(function(i) {
  27
  28             $(items[i]).mouseover(function() {
  29                mOver = true;
  30             });
  31
  32             $(items[i]).mouseout(function() {
  33                 mOver   = false;
  34                 fadeElement(true);
  35             });
  36
  37         });
  38
  39         var fadeElement = function(isMouseOut) {
  40             var thisTimeOut = (isMouseOut) ? (timeOut/2) : timeOut;
  41             thisTimeOut = (faderStat) ? 10 : thisTimeOut;
  42             if(items.length > 0) {
  43                 timeOutFn = setTimeout(makeSlider, thisTimeOut);
  44             } else {
  45                 console.log("Poof..");
  46             }
  47         }
  48
  49         var makeSlider = function() {
  50             current = (current != null) ? current : items[(items.length-1)];
  51             var currNo      = jQuery.inArray(current, items) + 1
  52             currNo = (currNo == items.length) ? 0 : (currNo - 1);
  53             var newMargin   = $(element).width() * currNo;
  54             if(faderStat == true) {
  55                 if(!mOver) {
  56                     $(items[currNo]).fadeIn((timeOut/6), function() {
  57                         if($(itemsSpan[currNo]).css('bottom') == 0) {
  58                             $(itemsSpan[currNo]).slideUp((timeOut/6), function() {
  59                                 faderStat = false;
  60                                 current = items[currNo];
  61                                 if(!mOver) {
  62                                     fadeElement(false);
  63                                 }
  64                             });
  65                         } else {
  66                             $(itemsSpan[currNo]).slideDown((timeOut/6), function() {
  67                                 faderStat = false;
  68                                 current = items[currNo];
  69                                 if(!mOver) {
  70                                     fadeElement(false);
  71                                 }
  72                             });
  73                         }
  74                     });
  75                 }
  76             } else {
  77                 if(!mOver) {
  78                     if($(itemsSpan[currNo]).css('bottom') == 0) {
  79                         $(itemsSpan[currNo]).slideDown((timeOut/6), function() {
  80                             $(items[currNo]).fadeOut((timeOut/6), function() {
  81                                 faderStat = true;
  82                                 current = items[(currNo+1)];
  83                                 if(!mOver) {
  84                                     fadeElement(false);
  85                                 }
  86                             });
  87                         });
  88                     } else {
  89                         $(itemsSpan[currNo]).slideUp((timeOut/6), function() {
  90                         $(items[currNo]).fadeOut((timeOut/6), function() {
  91                                 faderStat = true;
  92                                 current = items[(currNo+1)];
  93                                 if(!mOver) {
  94                                     fadeElement(false);
  95                                 }
  96                             });
  97                         });
  98                     }
  99                 }
 100             }
 101         }
 102
 103         makeSlider();
 104
 105     };
 106
 107 })(jQuery);
 108
 109
 110 jQuery(document).ready(function() {
 111         //jQuery.noConflict();
 112
 113         if (jQuery('div#s3slider').length > 0) {
 114                 jQuery('div#s3slider').s3Slider({
 115                         timeOut: 4000
 116                 });
 117         }
 118 });