This repository has been archived by the owner on Nov 29, 2020. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
BannerSlider.min.js
1 lines (1 loc) · 6.53 KB
/
BannerSlider.min.js
1
function Slider(){let e={address:["http://file1.wailian.work/2017/06/23/bgimg_1.jpg","http://file1.wailian.work/2017/06/23/bgimg_2.jpg","http://file1.wailian.work/2017/06/23/bgimg_3.jpg","http://file1.wailian.work/2017/06/23/bgimg_4.jpg"],method:"random",containerId:"body",duration:"1s",delay:3e3,indicatorStyle:"dot",customIndicator:false,indicatorCodes:["box-shadow:0 0 5px 2px red; opacity:0.8"],hasClick:false,callback:[]};let t=-1;let o=false;Slider.prototype.opts=null;Slider.prototype.init=function(){if(this.opts===null){this.opts=e}let s=this.opts.address;let i;let a;let l;this.opts.containerId===undefined?i=e.containerId:i=this.opts.containerId;this.opts.hasClick===undefined?a=e.hasClick:a=this.opts.hasClick;this.opts.callback===undefined?l=e.callback:l=this.opts.callback;let d=0;let n=document.createElement("div");let r=document.createElement("div");n.className="div-cover";r.className="box-cover";for(let e in s){let t=document.createElement("img");t.className="img-cover";t.id="img-cover"+d;t.src=s[e];n.appendChild(t);let o=document.createElement("div");o.className="sign-cover";o.id="sign-"+d;r.appendChild(o);g(o,t,d);d++}n.appendChild(r);let m=null;if(i==="body"){m=document.getElementsByTagName("body")[0]}else{m=document.getElementById(i)}m.appendChild(n);this.slide(n);let c=0;let h=0;let f=0;function g(e,s,i){addEventListener(e,"hover",()=>{t=0;let o=n.getElementsByClassName("sign-cover sign-on")[0];c=o.id;removeClass(o," sign-on");let i=n.getElementsByClassName("img-cover show")[0];let a=n.getElementsByClassName("img-cover hide");h=i.id;removeClass(i," show");for(let e=0;e<a.length;e++){f=a[e].id;removeClass(a[e]," hide")}e.className+=" sign-on";s.className+=" show"});addEventListener(n,"mouseLeave",()=>{if(c===0){return}t=-1;o=!o;removeClass(document.getElementsByClassName("sign-cover sign-on")[0]," sign-on");removeClass(document.getElementsByClassName("img-cover show")[0]," show");if(c!==0){document.getElementById(c).className+=" sign-on";c=0}if(h!==0)document.getElementById(h).className+=" show";if(f!==0)document.getElementById(f).className+=" hide"});if(a){addEventListener(s,"click",()=>{l[i]()})}}};Slider.prototype.slide=function(s){const i=["random","leftSlide","rightSlide","upSlide","downSlide","expandX","roll"];let a=this.opts.method;let l="1s";let d=3e3;let n=document.getElementsByTagName("head")[0];let r=document.createElement(`style`);let m=s.getElementsByTagName("img");let c=s.getElementsByClassName("sign-cover");!this.opts.duration?l="1s":l=this.opts.duration;!this.opts.delay?d=3e3:d=this.opts.delay;addStyle(r,".div-cover","width:100%;height:100%;position:relative;overflow:hidden;");addStyle(r,".img-cover","width:100%;height:100%;position:absolute;top:0;left:0;display:none;");if(this.opts.hasClick===true)addStyle(r,".img-cover","cursor:pointer;");const h=["width:100%;height:auto;position:absolute;bottom:5px;z-index:9;text-align:center;","width:10px;height:10px;background:white;border-radius:5px;display:inline-block;margin:0 10px;opacity:0.5;","box-shadow:0 0 5px 2px lightblue; opacity:0.8;"];if(this.opts.customIndicator===true){let t;this.opts.indicatorCodes===undefined?t=e.indicatorCodes:t=this.opts.indicatorCodes;switch(t.length){case 2:addStyle(r,".box-cover",h[0]);addStyle(r,".sign-cover",t[0]);addStyle(r,".sign-on",t[1]);break;case 3:addStyle(r,".box-cover",t[0]);addStyle(r,".sign-cover",t[1]);addStyle(r,".sign-on",t[2]);break;default:addStyle(r,".box-cover",h[0]);addStyle(r,".sign-cover",h[1]);addStyle(r,".sign-on",t[0]);break}}else{switch(this.opts.indicatorStyle){case"vertical":addStyle(r,".box-cover",`${h[0]}width: auto;right: 10px;bottom:50%;transform:translateY(50%);`);addStyle(r,".sign-cover",`${h[1]}display: block;margin: 10px 0;`);addStyle(r,".sign-on",h[2]);break;case"thumb":addStyle(r,".box-cover",h[0]);addStyle(r,".sign-cover",`${h[1]}width:80px;height:40px;border-radius:2px;`);addStyle(r,".sign-on",`${h[2]}opacity:1`);for(let e=0;e<c.length;e++){addStyle(r,`#${c[e].id}`,`background: URL(${this.opts.address[e]});background-size:100%;`)}break;default:addStyle(r,".box-cover",h[0]);addStyle(r,".sign-cover",h[1]);addStyle(r,".sign-on",h[2]);break}}if(a===i[0]){a=i[Math.round(Math.random()*(i.length-1))]}if(a===i[1]){addStyle(r,"@keyframes showUp","from{left:-100%;}to{left:0}");addStyle(r,"@keyframes hideDown","from{left:0;}to{left:100%;}")}else if(a===i[2]){addStyle(r,"@keyframes showUp","from{left:100%;}to{left:0;}");addStyle(r,"@keyframes hideDown","from{left:0;}to{left:-100%;}")}else if(a===i[3]){addStyle(r,"@keyframes showUp","from{top:-100%;}to{top:0;}");addStyle(r,"@keyframes hideDown","from{top:0;}to{top:100%;}")}else if(a===i[4]){addStyle(r,"@keyframes showUp","from{top:100%;}to{top:0;}");addStyle(r,"@keyframes hideDown","from{top:0;}to{top:-100%;}")}else if(a===i[5]){addStyle(r,"@keyframes showUp","from{transform:rotate3d(0,1,0,60deg);}to{transform:rotate3D(0,0,0,0);}");addStyle(r,"@keyframes hideDown","from{opacity:1;}to{opacity:0;}")}else if(a===i[6]){addStyle(r,"@keyframes showUp","from{transform:rotate(60deg);}to{transform:rotate3D(0,0,0,0);}");addStyle(r,"@keyframes hideDown","from{transform:rotate3D(0,0,0,0);}to{transform:rotate(-120deg);}")}else{addStyle(r,"@keyframes showUp","from{opacity:0;}to{opacity:1;}");addStyle(r,"@keyframes hideDown","from{opacity:1;}to{opacity:0;}")}addStyle(r,".show",`display:block;animation: showUp ${l}; z-index:9`);addStyle(r,".hide",`display:block;animation: hideDown ${l} ; animation-fill-mode:forwards;`);n.appendChild(r);function f(){for(let e=0;e<=m.length;e++){setTimeout(()=>{if(t!==-1){if(e===m.length)f();return}if(o){o=!o;let e=s.getElementsByClassName("sign-cover sign-on");for(let t=0;t<e.length;t++)removeClass(e[t]," sign-on");let t=s.getElementsByClassName("img-cover show");let i=s.getElementsByClassName("img-cover hide");for(let e=0;e<t.length;e++)removeClass(t[e]," show");for(let e=0;e<i.length;e++)removeClass(i[e]," hide")}if(e===m.length){removeClass(m[e-1]," show");removeClass(c[e-1]," sign-on");m[e-1].className+=" hide";f();return}if(e===0){removeClass(m[m.length-2]," hide")}if(e>0){if(e===1)removeClass(m[m.length-1]," hide");if(e>1)removeClass(m[e-2]," hide");removeClass(m[e-1]," show");removeClass(c[e-1]," sign-on");m[e-1].className+=" hide"}m[e].className+=" show";c[e].className+=" sign-on"},e*d)}}f()}}function removeClass(e,t){if(e.className.indexOf(t)!==-1)e.className=e.className.substring(0,e.className.indexOf(t))}function addEventListener(e,t,o){if(t==="hover"){return e.onmouseover=(()=>{return o()})}if(t==="mouseLeave"){return e.onmouseleave=(()=>{return o()})}if(t==="click"){return e.onclick=(()=>{return o()})}}function addStyle(e,t,o){e.innerText+=t+"{"+o+"}"}