From 72f63d7bc3261e953f8ce99f72f64ce0bb7bed8b Mon Sep 17 00:00:00 2001 From: Viktoria Husaruk Date: Wed, 30 Nov 2016 14:46:48 +0200 Subject: [PATCH] [FEATURE] Make the slider autoslide (Podio Feature_41) (#18) --- dev/js/main/contentElements/slider.js | 52 ++++++++++++++------------- 1 file changed, 28 insertions(+), 24 deletions(-) diff --git a/dev/js/main/contentElements/slider.js b/dev/js/main/contentElements/slider.js index 5c83a9a..d999c11 100644 --- a/dev/js/main/contentElements/slider.js +++ b/dev/js/main/contentElements/slider.js @@ -7,32 +7,36 @@ // initialize swiper when document ready // http://idangero.us/swiper/api/ - var swiper = new Swiper('.js__img-slider', { - nextButton: '.js__img-slider__btn-next', - prevButton: '.js__img-slider__btn-prev', - pagination: '.js__img-slider__pagination', - paginationClickable: true, - preloadImages: false, - lazyLoading: true, - watchSlidesVisibility: true, - lazyLoadingInPrevNext: true, - speed: 600 - }); - // Makes it possible to skip between slider images if they have links, using the tab button - swiper.container.on('focus', 'a', function(e) { - //Index of focused slide - var focusIndex = $(e.target).parents('.swiper-slide').index(); - //Reset scrollLeft set by browser on focus - swiper.container.scrollLeft(0); + var $elem = $('.js__img-slider'); + $elem.each(function() { + var time = $(this).attr('data-autoplay'); + var slider = new Swiper($(this), { + nextButton: '.js__img-slider__btn-next', + prevButton: '.js__img-slider__btn-prev', + pagination: '.js__img-slider__pagination', + paginationClickable: true, + preloadImages: false, + lazyLoading: true, + watchSlidesVisibility: true, + lazyLoadingInPrevNext: true, + speed: 600, + autoplay: time + }); + // Makes it possible to skip between slider images if they have links, using the tab button + slider.container.on('focus', 'a', function(e) { + //Index of focused slide + var focusIndex = $(e.target).parents('.swiper-slide').index(); + //Reset scrollLeft set by browser on focus + slider.container.scrollLeft(0); - // IE fix - setTimeout(function() { - swiper.container.scrollLeft(0); - }, 0); + // IE fix + setTimeout(function() { + slider.container.scrollLeft(0); + }, 0); - //Slide to focused slide - swiper.slideTo(focusIndex); + //Slide to focused slide + slider.slideTo(focusIndex); + }); }); }); - })(jQuery);