var alan = (function(document, undefined) { var readyRE = /complete|loaded|interactive/; var idSelectorRE = /^#([\w-]+)$/; var classSelectorRE = /^\.([\w-]+)$/; var tagSelectorRE = /^[\w-]+$/; var translateRE = /translate(?:3d)?\((.+?)\)/; var translateMatrixRE = /matrix(3d)?\((.+?)\)/; var $ = function(selector, context) { context = context || document; if (!selector) return wrap(); if (typeof selector === 'object') if ($.isArrayLike(selector)) { return wrap($.slice.call(selector), null); } else { return wrap([selector], null); } if (typeof selector === 'function') return $.ready(selector); if (typeof selector === 'string') { try { selector = selector.trim(); if (idSelectorRE.test(selector)) { var found = document.getElementById(RegExp.$1); return wrap(found ? [found] : []); } return wrap($.qsa(selector, context), selector); } catch (e) {} } return wrap(); }; var wrap = function(dom, selector) { dom = dom || []; Object.setPrototypeOf(dom, $.fn); dom.selector = selector || ''; return dom; }; /** * querySelectorAll * @param {type} selector * @param {type} context * @returns {Array} */ $.qsa = function(selector, context) { context = context || document; return $.slice.call(classSelectorRE.test(selector) ? context.getElementsByClassName(RegExp.$1) : tagSelectorRE.test(selector) ? context.getElementsByTagName(selector) : context.querySelectorAll(selector)); }; $.uuid = 0; $.data = {}; $.insertAfter = function(elem,tarElem){ var parent = tarElem.parentNode; if (parent.lastChlid == tarElem) { parent.appendChild(elem); }else{ parent.insertBefore(elem,tarElem.nextSibling); } }; // 鏌ユ壘鍏勫紵鍏冪礌 $.getSiblings = function(o){ var a = []; var p = o.previousSibling; while(p){ if(p.nodeType === 1){ a.push(p); } p = p.previousSibling; } a.reverse(); var n = o.nextSibling; while(n){ if(n.nodeType === 1){ a.push(n); } n = n.nextSibling; } return a; }; $.toggleClass = function( elem, c ) { if(elem.classList.contains(c)){ elem.classList.remove(c); }else{ elem.classList.add(c); } }; /* 绉诲姩绔偣鍑讳簨浠舵ā鎷烶C绔痟over浜嬩欢 * class1,閫夋嫨鍖归厤鐨勫厓绱 * class2,鍖归厤鍏冪礌閲岀殑a鍏冪礌锛岄樆姝㈠畠璺宠浆 * */ $.touchToHover = function (class1,class2) { [].slice.call(document.querySelectorAll(class1)).forEach( function( el) { el.querySelector(class2).addEventListener( 'touchstart', function(e) { console.log(this); //e.stopPropagation(); e.preventDefault(); }, false ); el.addEventListener( 'touchstart', function(e) { $.toggleClass( this, 'cs-hover' ); }, false ); }); }; $.getStyle = function(elem,attr){ return elem.currentStyle ? elem.currentStyle[attr] : window.getComputedStyle(elem,false)[attr]; }; $.getElemPosition = function(elem){ var oPositon = elem.getBoundingClientRect(); return { top:oPositon.top, bottom:oPositon.bottom, left:oPositon.left, right:oPositon.right, }; }; $.Event = { on:function(elem,type,handler){ if (elem.addEventListener) { elem.addEventListener(type,handler,false); }else if(elem.attachEvent){ elem.attachEvent('on'+type,handler); }else{ elem['on'+type] = handler; } }, off:function(elem,type,handler){ if (elem.removeEventListener) { elem.removeEventListener(type,handler,false); }else if (elem.detachEvent) { elem.detachEvent('on'+type,handler); }else{ elem['on'+type] = null; } }, getEvent:function(event){ //灏嗗畠鏀惧湪浜嬩欢澶勭悊绋嬪簭鐨勫紑澶达紝鍙互纭繚鑾峰彇浜嬩欢銆 return event ? event : window.event; }, getTarget:function(event){ //鐩爣鍏冪礌 return event.target || event.srcElement; }, preventDefault:function(event){ //鍙栨秷榛樿 if (event.preventDefault) { event.preventDefault(); }else{ event.returnValue = false; } }, stopPropagation:function(event){ //闃绘鍐掓场 if (event.stopPropagation) { event.stopPropagation(); }else{ event.cancelBubble = true; } }, getRelatedTarget:function(event){//鑾峰緱鐩稿叧鍏冪礌 if (event.relatedTarget) { return event.relatedTarget; }else if (event.toElement) { return event.toElement; }else if (event.fromElement) { return event.fromElement; }else{ return null; } }, getButton:function(event){ //鑾峰彇榧犳爣鎸夐挳 if (alan.isSupported2) { return event.button; }else{ switch(event.button){ case 0: case 1: case 3: case 5: case 7: return 0; case 2: case 6: return 2; case 4: return 1; } } }, getWheelDelta:function(event){ //婊氳疆鐨勪簨浠 if (event.wheelDelta) { return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta); }else{ return -event.detail * 40; } }, getCharCode:function(event){ if (typeof event.charCode == 'number') { return event.charCode; }else{ return event.keyCode; } } }; /** * 鍦ㄨ繛缁暣鏁颁腑鍙栧緱涓€涓殢鏈烘暟 * @param {number} * @param {number} * @param {string} 'star' || 'end' || 'both' 闅忔満鏁板寘鎷瑂tarNum || endNum || both * @return 涓€涓殢鏈烘暟 */ $.mathRandom = function(starNum,endNum,type){ var num = endNum - starNum; switch (type) { case 'star' : return parseInt(Math.random()*num + starNum,10); case 'end' : return Math.floor(Math.random()*num + starNum) + 1; case 'both' : return Math.round(Math.random()*num + starNum); default : console.log('娌℃湁鎸囧畾闅忔満鏁扮殑鑼冨洿'); } }; // 鑾峰緱鏁扮粍涓渶灏忓€ $.getArrayMin = function(array) { /*var min = array[0]; array.forEach(function (item) { if(item < min){ min = item; } }); return min;*/ return Math.min.apply(Math,array); }; // 鑾峰緱鏁扮粍涓渶澶у€ $.getArrayMax = function (array) { return Math.max.apply(Math,array); }; // 鏁扮粍鍘婚噸澶 $.getArrayNoRepeat = function (array) { var noRepeat = []; var data = {}; array.forEach(function (item) { if(!data[item]){ noRepeat.push(item); data[item] = true; } }); return noRepeat; }; $.isArray = function(val){ return Array.isArray(val) || Object.prototype.toString.call(val) === '[object Array]'; }; $.isFunction = function(val){ return Object.prototype.toString.call(val) == '[object Function]'; }; $.isRegExp = function(val){ return Object.prototype.toString.call(val) == '[object RegExp]'; }; $.isMacWebkit = (navigator.userAgent.indexOf("Safari") !== -1 && navigator.userAgent.indexOf("Version") !== -1); $.isFirefox = (navigator.userAgent.indexOf("Firefox") !== -1); // $.fn = { each: function(callback) { [].every.call(this, function(el, idx) { return callback.call(el, idx, el) !== false; }); return this; } }; //鍏煎 AMD 妯″潡 if (typeof define === 'function' && define.amd) { define('alan', [], function() { return $; }); } return $; })(document); // 婊氬姩鍔ㄧ敾 (function ($) { /* * 闇€瑕佸湪css鏂囦欢閲屾坊鍔 .scroll-animate.animated {visibility: hidden;} 鏍峰紡锛岃В鍐?闂竴涓?鐨刡ug * .disable-hover {pointer-events: none;} 涔熼渶瑕佸姞鍦ㄦ牱寮忚〃涓 * 濡傛灉婊氬姩浜嬩欢澶辨晥锛屾煡鐪媌ody鍏冪礌鏄惁璁剧疆浜 {height:100%}锛屽畠浼氬奖鍝嶆粴鍔ㄤ簨浠躲€ * */ var ScrollAnimate = function (opt) { this.opt = opt || {}; this.className = this.opt.className || '.scroll-animate'; // 鑾峰彇闆嗗悎鐨刢lass this.animateClass = this.opt.animateClass || 'animated'; // 鍔ㄧ敾渚濊禆鐨刢lass this.elem = document.querySelectorAll(this.className); // 闇€瑕佹粴鍔ㄥ睍绀虹殑鍏冪礌 this.position = []; // 鎵€鏈夊厓绱犵殑offsetTop璺濈鏁扮粍 this.windowHeight = ('innerHeight' in window) ? window.innerHeight : document.documentElement.clientHeight; this.time = null; this.body = document.body; this.init(); }; ScrollAnimate.prototype = { getPosition:function () { var self = this; self.position.length = 0; // 閲嶇疆鏁扮粍 [].slice.call(self.elem).forEach(function (elem) { if(elem.classList.contains('father')){ var children = elem.querySelectorAll(elem.getAttribute('data-child')); var delay = parseFloat(elem.getAttribute('data-delay')); [].slice.call(children).forEach(function (obj,index) { obj.classList.add('animated'); obj.style.visibility = 'hidden'; if(obj.getAttribute('data-delay')){ obj.style.animationDelay = obj.getAttribute('data-delay') + 's'; }else{ obj.style.animationDelay = delay * index + 's'; } }) }else if(elem.classList.contains('font-fadeIn')){ elem.style.visibility = 'hidden'; }else{ elem.classList.add('animated'); } self.position.push(self.getOffsetTop(elem)); }); }, getOffsetTop:function(element){ var top; while (element.offsetTop === void 0) { element = element.parentNode; } top = element.offsetTop; while (element = element.offsetParent) { top += element.offsetTop; } return top; }, scrollEvent:function () { var self = this; self.body.classList.add('disable-hover'); clearTimeout(self.time); self.time = setTimeout(function () { self.body.classList.remove('disable-hover'); },100); var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; self.position.forEach(function (item,index) { var currentElem = self.elem[index]; var effect = currentElem.getAttribute('data-effect') || 'fadeInUp'; var Tclass = currentElem.getAttribute('data-Tclass') || 'go'; var flag = (scrollTop + self.windowHeight >item) ? true : false; // 鍒ゆ柇褰撳墠鍏冪礌鏄惁鏈塮ather锛屽緱鐭ュ皢鍔ㄧ敾搴旂敤鍒板綋鍓嶅厓绱犺繕鏄綋鍓嶅厓绱犲埌瀛愬厓绱犮€ if(currentElem.classList.contains('father')){ var children = currentElem.querySelectorAll(currentElem.getAttribute('data-child')); if(flag){ [].slice.call(children).forEach(function (item) { if(item.style.visibility == 'hidden'){ item.style.visibility = 'visible'; // 鍒ゆ柇鏄惁涓烘粴鍔ㄦ暟瀛楁晥鏋滅殑鍏冪礌 // 鏁板瓧婊氬姩鐨勬晥鏋滐紝榛樿閮芥斁鍦╢ather鐨勫鍣ㄩ噷锛屽洜涓鸿繖涓晥鏋滀竴鑸兘鏄涓悓鏃跺嚭鐜般€ if(item.classList.contains('count-up')){ //self.countUp(item,true); }else{ if(item.getAttribute('data-effect')){ item.classList.add(item.getAttribute('data-effect')); }else{ item.classList.add(effect); } } } }) }else{ [].slice.call(children).forEach(function (item) { if(item.style.visibility == 'visible'){ /*if(item.classList.contains('count-up')){ self.countUp(item,false); // 浼犲叆false锛屽憡璇夊嚱鏁版竻绌鸿鏃跺櫒銆 }*/ if(item.getAttribute('data-effect')){ item.classList.remove(item.getAttribute('data-effect')); }else{ item.classList.remove(effect); } item.style.visibility = 'hidden'; } }); } }else if(currentElem.classList.contains('font-fadeIn')){ // 鏂囧瓧娣″叆鍒版晥鏋 if(flag && currentElem.style.visibility == 'hidden'){ self.fontEffect(currentElem); }else if(!flag && currentElem.style.visibility == 'visible'){ currentElem.style.visibility = 'hidden' } }else if(currentElem.classList.contains('classGo')){ //婊氬姩鍒颁綅缃坊鍔犲姩鐢荤被 if(flag){ currentElem.style.visibility = 'visible'; currentElem.classList.add(Tclass); }else{ if(currentElem.style.visibility == 'visible'){ currentElem.classList.remove(Tclass); currentElem.style.visibility = 'hidden'; } } }else{ if(flag){ currentElem.style.visibility = 'visible'; currentElem.classList.add(effect); currentElem.style.animationDelay = currentElem.getAttribute('data-delay') + 's'; }else{ if(currentElem.style.visibility == 'visible'){ currentElem.classList.remove(effect); currentElem.style.visibility = 'hidden'; } } } }) }, countUp:function (elem,isTrue) { // 鏁堟灉涓嶇悊鎯筹紝鏀惧純浜嗐€ if(isTrue){ elem.innerHtml = ''; var time = elem.getAttribute('data-time'); var sum = elem.getAttribute('data-text'); var speed = Math.ceil(time / 100); var increment = Math.round(sum / speed); var number = 1; elem.timer = setInterval(function () { if(number < sum){ number += increment; elem.innerText = number; }else{ elem.innerText = sum; clearInterval(elem.timer); } },100); console.log(speed); }else{ console.log('娓呯┖瀹氭椂鍣?); clearInterval(elem.timer); } }, fontEffect:function (elem) { var array = elem.getAttribute('data-text').split(''); var delay = elem.getAttribute('data-delay'); var effect = elem.getAttribute('data-effect') || 'fadeIn'; elem.innerHTML = ''; var Fragment = document.createDocumentFragment(); array.forEach(function (item,i) { var span = document.createElement("font"); span.className='animated'; span.classList.add(effect); if(delay){ span.style.animationDelay = delay * i + 's'; }else{ span.style.animationDelay = 0.1 * i + 's'; } span.innerText = item; Fragment.appendChild(span); }); elem.style.visibility = 'visible'; elem.appendChild(Fragment); }, init:function () { var self = this; if(self.elem.length < 1){ console.log('婊氬姩鍔ㄧ敾瀵硅薄闆嗗悎涓洪浂'); return; } self.scrollEvent = self.scrollEvent.bind(this); setTimeout(function () { self.getPosition(); // 鑾峰彇姣忎釜鍏冪礌鐨勪綅缃紝瀛樻斁鍦ㄤ竴涓暟缁勩€ self.scrollEvent(); var _scrollEvent = throttlePro(self.scrollEvent,100,300); document.addEventListener('scroll',_scrollEvent,false); // 鏀瑰彉绐楀彛澶у皬锛岄噸鏂板垵濮嬪寲涓€浜涙暟鎹 window.onresize = function () { //console.log('resize the window'); throttle(function () { self.windowHeight = ('innerHeight' in window) ? window.innerHeight : document.documentElement.clientHeight; self.getPosition(); self.scrollEvent(); }) }; },0); } }; setTimeout(function () { $.scrollAnimate = ScrollAnimate; },1); })(alan); // 鍑芥暟鎴祦 function throttle(method,context){ clearTimeout(method.tId); method.tId = setTimeout(function(){ method.call(context); },500); } function throttlePro(fn, delay, mustRunDelay){ var timer = null; var t_start; return function(){ var context = this, args = arguments, t_curr = +new Date(); clearTimeout(timer); if(!t_start){ t_start = t_curr; } if(t_curr - t_start >= mustRunDelay){ fn.apply(context, args); t_start = t_curr; } else { timer = setTimeout(function(){ fn.apply(context, args); }, delay); } }; } //鑿滃崟娣诲姞婵€娲绘潯 (function($) { $.fn.lavaLamp = function(o) { o = $.extend({ fx: "linear", speed: 500, click: function() {} }, o || {}); return this.each(function() { var b = $(this), noop = function() {}, $back = $('