https://mediasuite.ca/js/jquery-banner-slider.js

1$(document).ready(function(){
2	//Configuration
3		  var retour = true;
4		  var tempsTransition = 1000; //transition time
5		  var affichePlayPause = true; //Play Pause displays
6		  var lectureAutomatique = true; //Automatic reading
7		  var tempsAttente = 8000; //waiting time
8			
9		  var icones = new Array();
10		  		icones['play'] = 'images/layout/play-slider-circle.png';
11		  		icones['pause'] = 'images/layout/pause-slider-circle.png';
12			
13		  var currentPosition = 0;
14		  var slideWidth = 960;
15		  var slides = $('.slide');
16		  var numberOfSlides = slides.length;
17		  var interval;
18		  var lectureEnCours = false;
19
20  // Remove scrollbar in JS
21  $('#slidesContainer').css('overflow', 'hidden');
22
23  // Wrap all .slides with #slideInner div
24  slides
25    .wrapAll('<div id="slideInner"></div>')
26    // Float left to display horizontally, readjust .slides width
27	.css({
28      'float' : 'left',
29      'width' : slideWidth
30    });
31
32  // Set #slideInner width equal to total width of all slides
33  $('#slideInner').css('width', slideWidth * numberOfSlides);
34
35  // Insert controls in the DOM
36  $('#slideshow')
37    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
38    .append('<span class="control" id="rightControl">Clicking moves right</span>');
39
40  // Hide left arrow control on first load
41  manageControls(currentPosition);
42
43  // Create event listeners for .controls clicks
44  $('.control')
45    .bind('click', function(){
46    // Determine new position
47	currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
48    
49	if(currentPosition == numberOfSlides && retour == false ){
50		currentPosition--;
51		pause();
52	}
53	
54	// Hide / show controls
55    manageControls(currentPosition);
56    // Move slideInner using margin-left
57    $('#slideInner').animate({
58      'marginLeft' : slideWidth*(-currentPosition)
59    });
60  });
61
62  // manageControls: Hides and Shows controls depending on currentPosition
63  function manageControls(position){
64    // Hide left arrow if position is first slide
65	if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
66	// Hide right arrow if position is last slide
67    if(position==numberOfSlides-1 && retour == false){
68		$('#rightControl').hide();
69	} else {
70		$('#rightControl').show();
71	}
72	if(position == numberOfSlides && retour == true){
73		currentPosition = 0;
74		 $('#leftControl').hide();
75	}
76  }
77  function suivant(){
78	$('#rightControl').click();
79	}
80  function start() {
81  	lectureEnCours = true;
82    interval = setInterval(suivant, tempsAttente );
83  }
84  function pause() {
85  	lectureEnCours = false;
86   clearInterval(interval);
87  }
88  
89 //If the slide is activated
90if(lectureAutomatique == true){
91  start();
92}
93if(affichePlayPause == true){
94	$('#slidesContainer').prepend('<img id="navDiapo" src="" alt="Navigation diaporama" />');
95	if(lectureAutomatique == true){
96		$('#navDiapo').attr('src',icones['pause']);
97	}else{
98		$('#navDiapo').attr('src',icones['play']);	
99	}
100	$('#navDiapo').bind('click', function(){
101		if(lectureEnCours == true){
102			$(this).attr('src',icones['play']);
103			pause();
104		}else{
105			$(this).attr('src',icones['pause']);
106			start();
107		}
108	});
109}
110
111
112  	
113});