$(function(){
 $('#slider2')
  .anythingSlider({
   
    // Appearance
  theme               : "minimalist-square", // Theme name
  expand              : true,     // If true, the entire slider will expand to fit the parent element
  resizeContents      : true,      // If true, solitary images/objects in the panel will expand to fit the viewport
  width               : 580, // 580 OK - pris en compte ssi ResizeContents = true  sinon Width = div.anythingSlider //
  height              : 250, // 250 OK pris en compte ssi ResizeContents = true //
  vertical            : false,     // If true, all panels will slide vertically; they slide horizontally otherwise
  showMultiple        : false,     // Set this value to a number and it will show that many slides at once
  easing              : "swing",   // Anything other than "linear" or "swing" requires the easing plugin or jQuery UI

  buildArrows         : true,      // If true, builds the forwards and backwards buttons
  buildNavigation     : true,      // If true, builds a list of anchor links to link to each panel
  buildStartStop      : true,      // If true, builds the start/stop button and adds slideshow functionality

  appendForwardTo     : null,      // Append forward arrow to a HTML element (jQuery Object, selector or HTMLNode), if not null
  appendBackTo        : null,      // Append back arrow to a HTML element (jQuery Object, selector or HTMLNode), if not null
  appendControlsTo    : null,      // Append controls (navigation + start-stop) to a HTML element (jQuery Object, selector or HTMLNode), if not null
  appendNavigationTo  : null,      // Append navigation buttons to a HTML element (jQuery Object, selector or HTMLNode), if not null
  appendStartStopTo   : null,      // Append start-stop button to a HTML element (jQuery Object, selector or HTMLNode), if not null

  toggleArrows        : false,     // If true, side navigation arrows will slide out on hovering & hide @ other times
  toggleControls      : false,     // if true, slide in controls (navigation + play/stop button) on hover and slide change, hide @ other times

  startText           : "Start",   // Start button text
  stopText            : "Stop",    // Stop button text
  forwardText         : "&raquo;", // Link text used to move the slider forward (hidden by CSS, replaced with arrow image)
  backText            : "&laquo;", // Link text used to move the slider back (hidden by CSS, replace with arrow image)
  tooltipClass        : "tooltip", // Class added to navigation & start/stop button (text copied to title if it is hidden by a negative text indent)

  // Function
  enableArrows        : true,      // if false, arrows will be visible, but not clickable.
  enableNavigation    : true,      // if false, navigation links will still be visible, but not clickable.
  enableStartStop     : true,      // if false, the play/stop button will still be visible, but not clickable. Previously "enablePlay"
  enableKeyboard      : true,      // if false, keyboard arrow keys will not work for this slider.

  // Navigation
  startPanel          : 1,         // This sets the initial panel
  changeBy            : 1,         // Amount to go forward or back when changing panels.
  hashTags            : true,      // Should links change the hashtag in the URL?
  infiniteSlides      : true,      // if false, the slider will not wrap & not clone any panels
  navigationFormatter : null,      // Details at the top of the file on this use (advanced use)
  navigationSize      : false,     // Set this to the maximum number of visible navigation tabs; false to disable

  // Slideshow options
  autoPlay            : true,     // If true, the slideshow will start running; replaces "startStopped" option
  autoPlayLocked      : false,     // If true, user changing slides will not stop the slideshow
  autoPlayDelayed     : false,     // If true, starting a slideshow will delay advancing slides; if false, the slider will immediately advance to the next slide when slideshow starts
  pauseOnHover        : true,      // If true & the slideshow is active, the slideshow will pause on hover
  stopAtEnd           : false,     // If true & the slideshow is active, the slideshow will stop on the last page. This also stops the rewind effect when infiniteSlides is false.
  playRtl             : false,     // If true, the slideshow will move right-to-left

  // Times
  delay               : 4000,      // How long between slideshow transitions in AutoPlay mode (in milliseconds)
  resumeDelay         : 15000,     // Resume slideshow after user interaction, only if autoplayLocked is true (in milliseconds).
  animationTime       : 600,       // How long the slideshow transition takes (in milliseconds)
  delayBeforeAnimate  : 0,         // How long to pause slide animation before going to the desired slide (used if you want your "out" FX to show).

  // Interactivity
  clickForwardArrow   : "click",         // Event used to activate forward arrow functionality (e.g. add jQuery mobile's "swiperight")
  clickBackArrow      : "click",         // Event used to activate back arrow functionality (e.g. add jQuery mobile's "swipeleft")
  clickControls       : "click focusin", // Events used to activate navigation control functionality
  clickSlideshow      : "click", 
  
  
  })
	
	.anythingSliderFx({
		// base FX definitions
		// '.selector' : [ 'effect(s)', 'distance/size', 'time', 'easing' ] - 'time' and 'easing' are optional parameters
		'.quoteSlide:first *' : [ 'grow', '24px', '400', 'easeInOutCirc' ],
    	'.quoteSlide:last'    : [ 'top', '500px', '400', 'easeOutElastic' ],
		'.expand'             : [ 'expand',  '10%', '400', 'easeInElastic' ],
		'.textSlide h3'       : [ 'top left', '500px', '500', 'easeOutBounce' ],
		'.textSlide h4'       : [ 'top right', '500px', '500', 'easeInQuint' ],
		'.textSlide img,.fade': [ 'fade' ],
		'.textSlide p'        : [ 'right', '200px', '500', 'easeInOutSine' ],
		'.textSlide li'       : [ 'listLR' ]

/*
		// for more precise control, use the "in" and "out" definitions
		// in = the animation that occurs when you slide "in" to a panel
		    inFx  : {
		     '.textSlide h3'  : { opacity: 1, top  : 0, time: 400, easing : 'easeOutBounce' },
		     '.textSlide li'  : { opacity: 1, left : 0, time: 400 },
		     '.textSlide img' : { opacity: 1, time: 400 },
		     '.quoteSlide'    : { top : 0, time: 400, easing : 'easeOutElastic' },
		     '.expand'        : { width: '100%', top: '0%', left: '0%', time: 400, easing : 'easeOutBounce' }
		    },
		// out = the animation that occurs when you slide "out" of a panel
		// (it also occurs before the "in" animation)
		     outFx : {
		     '.textSlide h3'      : { opacity: 0, top  : '-100px', time: 350 },
		     '.textSlide li:odd'  : { opacity: 0, left : '-200px', time: 350 },
		     '.textSlide li:even' : { opacity: 0, left : '200px',  time: 350 },
		     '.textSlide img'     : { opacity: 0, time: 350 },
		     '.quoteSlide:first'  : { top : '-500px', time: 350 },
		     '.quoteSlide:last'   : { top : '500px', time: 350 },
		     '.expand'            : { width: '10%', top: '50%', left: '50%', time: 350 }
		    } */
	});

	$('#slider3')
	.anythingSlider({
		width               : 580,
		height              : 250,
		startStopped        : false,
		navigationFormatter : function(i, panel){
			return ['Top', 'Right', 'Bottom', 'Left'][i - 1];
		}
	})
	.anythingSliderFx({
		'.caption-top'    : [ 'caption-Top', '50px' ],
		'.caption-right'  : [ 'caption-Right', '130px' ],
		'.caption-bottom' : [ 'caption-Bottom', '50px' ],
		'.caption-left'   : [ 'caption-Left', '130px' ]
	})
	/* use this code to have the caption slide in and out from the bottom with each panel
	.anythingSliderFx({
		inFx: {
			'.caption-top'    : { top: 0, opacity: 1, time: 400 },
			'.caption-right'  : { right: 0, opacity: 1, time: 400 },
			'.caption-bottom' : { bottom: 0, opacity: 1, time: 400 },
			'.caption-left'   : { left: 0, opacity: 1, time: 400 }
		},
		outFx: {
			'.caption-top'    : { top: -50, opacity: 0, time: 350 },
			'.caption-right'  : { right: -150, opacity: 0, time: 350 },
			'.caption-bottom' : { bottom: -50, opacity: 0, time: 350 },
			'.caption-left'   : { left: -150, opacity: 0, time: 350 }
		}
	}) 
	// add a close button (x) to the caption
	.find('div[class*=caption]')
		.css({ position: 'absolute' })
		.prepend('<span class="Fermer">x</span>')
		.find('.close').click(function(){
			var cap = $(this).parent(),
				ani = { bottom : -50 }; // bottom
			if (cap.is('.caption-top')) { ani = { top: -50 }; }
			if (cap.is('.caption-left')) { ani = { left: -150 }; }
			if (cap.is('.caption-right')) { ani = { right: -150 }; }
			cap.animate(ani, 400, function(){ cap.hide(); } );
		});

	/*  use this code if you only want the caption to appear when you hover over the panel 
	.find('.panel')
		.find('div[class*=caption]').css({ position: 'absolute' }).end()
		.hover(function(){ showCaptions( $(this) ) }, function(){ hideCaptions( $(this) ); });

	showCaptions = function(el){
		var $this = el;
		if ($this.find('.caption-top').length) { $this.find('.caption-top').show().animate({ top: 0, opacity: 1 }, 400); }
		if ($this.find('.caption-right').length) { $this.find('.caption-right').show().animate({ right: 0, opacity: 1 }, 400); }
		if ($this.find('.caption-bottom').length) { $this.find('.caption-bottom').show().animate({ bottom: 0, opacity: 1 }, 400); }
		if ($this.find('.caption-left').length) { $this.find('.caption-left').show().animate({ left: 0, opacity: 1 }, 400); }
	};
	hideCaptions = function(el){
		var $this = el;
		if ($this.find('.caption-top').length) { $this.find('.caption-top').stop().animate({ top: -50, opacity: 0 }, 400, function(){ $this.find('.caption-top').hide(); }); }
		if ($this.find('.caption-right').length) { $this.find('.caption-right').stop().animate({ right: -150, opacity: 0 }, 400, function(){ $this.find('.caption-right').hide(); }); }
		if ($this.find('.caption-bottom').length) { $this.find('.caption-bottom').stop().animate({ bottom: -50, opacity: 0 }, 400, function(){ $this.find('.caption-bottom').hide(); }); }
		if ($this.find('.caption-left').length) { $this.find('.caption-left').stop().animate({ left: -150, opacity: 0 }, 400, function(){ $this.find('.caption-left').hide(); }); }
	};

	// hide all captions initially 
	hideCaptions( $('#slider3 .panel') );
*/
});
