-
Notifications
You must be signed in to change notification settings - Fork 5
/
flipslide.min.js
10 lines (9 loc) · 1.23 KB
/
flipslide.min.js
1
2
3
4
5
6
7
8
9
10
/*
Plugin Name: Flip Slider
Dependency: JavaScript, CSS 3.0
Complete Reference on: https://github.com/ashishanexpert/Flip-Slider/
Developer: Ashish Kumar
Website: http://AshishKumar.asia
*/
function FlipSlider(e){function l(e){if(!t.querySelector(".animate")){r.classList.add("animate");if(e==-1){r.classList.add("animateL")}a=r.querySelector(".front");f=h(e);f.classList.add("back");u=setTimeout(function(){c();clearTimeout(u)},600)}}function c(){a=r.querySelector(".front");f=r.querySelector(".back");f.classList.add("front");f.classList.remove("back");a.classList.remove("front");r.classList.remove("animate");r.classList.remove("animateL")}function h(e){var t,n,s;i=r.querySelectorAll(".slide");s=i.length;for(var o=0;o<s;o++){if(i[o].classList.contains("front")){t=o}}if(e==-1){n=t<1?i[s-1]:i[t-1]}else{n=t+1<s?i[t+1]:i[0]}return n}var t=e.container,n=e.startIndex||0,r=t.querySelector(".flip"),i=r.querySelectorAll(".slide"),s=t.querySelector(".next"),o=t.querySelector(".prev"),u,a,f;this.nextFlip=function(){l(1)};this.prevFlip=function(){l(-1)};(function(e){n=n>=i.length?0:n;i[n].classList.add("front");s.onclick=e.nextFlip;o.onclick=e.prevFlip})(this)}
var flip1=new FlipSlider({startIndex:1,container:document.querySelector(".flip-slider")});