Guest User

Untitled

a guest
Oct 21st, 2018
87
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.87 KB | None | 0 0
  1. $(function() {
  2. var slider = $('.slider'),
  3. sliderContent = slider.html(), // Содержимое слайдера
  4. slideWidth = $('.slider-box').outerWidth(), // Ширина слайдера
  5. slideCount = $('.slider img').length, // Количество слайдов
  6. prev = $('.slider-box .prev'), // Кнопка "назад"
  7. next = $('.slider-box .next'), // Кнопка "вперед"
  8. sliderInterval = 4300, // Интервал смены слайдов
  9. animateTime = 4000, // Время смены слайдов
  10. course = 1, // Направление движения слайдера (1 или -1)
  11. margin = - slideWidth; // Первоначальное смещение слайдов
  12.  
  13. $('.slider img:last').clone().prependTo('.slider'); // Копия последнего слайда помещается в начало.
  14. $('.slider img').eq(1).clone().appendTo('.slider'); // Копия первого слайда помещается в конец.
  15. $('.slider').css('margin-left', -slideWidth); // Контейнер .slider сдвигается влево на ширину одного слайда.
  16.  
  17. function nextSlide(){ // Запускается функция animation(), выполняющая смену слайдов.
  18. interval = window.setInterval(animate, sliderInterval);
  19. }
  20.  
  21. function animate(){
  22. if (margin==-slideCount*slideWidth-slideWidth){ // Если слайдер дошел до конца
  23. slider.css({'marginLeft':-slideWidth}); // то блок .slider возвращается в начальное положение
  24. margin=-slideWidth*2;
  25. }else if(margin==0 && course==-1){ // Если слайдер находится в начале и нажата кнопка "назад"
  26. slider.css({'marginLeft':-slideWidth*slideCount});// то блок .slider перемещается в конечное положение
  27. margin=-slideWidth*slideCount+slideWidth;
  28. }else{ // Если условия выше не сработали,
  29. margin = margin - slideWidth*(course); // значение margin устанавливается для показа следующего слайда
  30. }
  31. slider.animate({'marginLeft':margin},animateTime); // Блок .slider смещается влево на 1 слайд.
  32. }
  33.  
  34. function sliderStop(){ // Функция преостанавливающая работу слайдера
  35. window.clearInterval(interval);
  36. }
  37.  
  38. prev.click(function() { // Нажата кнопка "назад"
  39. if (slider.is(':animated')) { return false; } // Если не происходит анимация
  40. var course2 = course; // Временная переменная для хранения значения course
  41. course = -1; // Устанавливается направление слайдера справа налево
  42. animate(); // Вызов функции animate()
  43. course = course2 ; // Переменная course принимает первоначальное значение
  44. });
  45. next.click(function() { // Нажата кнопка "назад"
  46. if (slider.is(':animated')) { return false; } // Если не происходит анимация
  47. var course2 = course; // Временная переменная для хранения значения course
  48. course = 1; // Устанавливается направление слайдера справа налево
  49. animate(); // Вызов функции animate()
  50. course = course2 ; // Переменная course принимает первоначальное значение
  51. });
  52.  
  53. slider.add(next).add(prev).hover(function() { // Если курсор мыши в пределах слайдера
  54. sliderStop(); // Вызывается функция sliderStop() для приостановки работы слайдера
  55. }, nextSlide); // Когда курсор уходит со слайдера, анимация возобновляется.
  56.  
  57. nextSlide(); // Вызов функции nextSlide()
  58. });
Add Comment
Please, Sign In to add comment