base库

  1 /*
  2  * 跨浏览器基础库===============================================
  3  * */
  4 
  5 //浏览器检测
  6 (function () {
  7     window.sys = {};
  8     var ua = navigator.userAgent.toLowerCase();
  9     var s;
 10     (s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[1] :
 11         (s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox = s[1] :
 12             (s = ua.match(/chrome\/([\d.]+)/)) ? sys.chrome = s[1] :
 13                 (s = ua.match(/opera\/.*version\/([\d.]+)/)) ? sys.opera = s[1] :
 14                     (s = ua.match(/version\/([\d.]+).*safari/)) ? sys.safari = s[1] : 0;
 15 
 16     if (/webkit/.test(ua)) sys.webkit = ua.match(/webkit\/([\d.]+)/)[1];
 17 })();
 18 
 19 //DOM加载
 20 function addDomLoaded(fn) {
 21     var isReady = false;
 22     var timer = null;
 23     function doReady() {
 24         if (timer) clearInterval(timer);
 25         if (isReady) return;
 26         isReady = true;
 27         fn();
 28     }
 29 
 30     if ((sys.opera && sys.opera < 9) || (sys.firefox && sys.firefox < 3) || (sys.webkit && sys.webkit < 525)) {
 31         //无论采用哪种，基本上用不着了
 32         /*timer = setInterval(function () {
 33          if (/loaded|complete/.test(document.readyState)) {     //loaded是部分加载，有可能只是DOM加载完毕，complete是完全加载，类似于onload
 34          doReady();
 35          }
 36          }, 1);*/
 37 
 38         timer = setInterval(function () {
 39             if (document && document.getElementById && document.getElementsByTagName && document.body) {
 40                 doReady();
 41             }
 42         }, 1);
 43     } else if (document.addEventListener) {//W3C
 44         addEvent(document, ‘DOMContentLoaded‘, function () {
 45             fn();
 46             removeEvent(document, ‘DOMContentLoaded‘, arguments.callee);
 47         });
 48     } else if (sys.ie && sys.ie < 9){
 49         var timer = null;
 50         timer = setInterval(function () {
 51             try {
 52                 document.documentElement.doScroll(‘left‘);
 53                 doReady();
 54             } catch (e) {};
 55         }, 1);
 56     }
 57 }
 58 
 59 //跨浏览器添加事件绑定
 60 function addEvent(obj, type, fn) {
 61     if (typeof obj.addEventListener != ‘undefined‘) {
 62         obj.addEventListener(type, fn, false);
 63     } else {
 64         //创建一个存放事件的哈希表(散列表)
 65         if (!obj.events) obj.events = {};
 66         //第一次执行时执行
 67         if (!obj.events[type]) {
 68             //创建一个存放事件处理函数的数组
 69             obj.events[type] = [];
 70             //把第一次的事件处理函数先储存到第一个位置上
 71             if (obj[‘on‘ + type]) obj.events[type][0] = fn;
 72         } else {
 73             //同一个注册函数进行屏蔽，不添加到计数器中
 74             if (addEvent.equal(obj.events[type], fn)) return false;
 75         }
 76         //从第二次开始我们用事件计数器来存储
 77         obj.events[type][addEvent.ID++] = fn;
 78         //执行事件处理函数
 79         obj[‘on‘ + type] = addEvent.exec;
 80     }
 81 }
 82 
 83 //为每个事件分配一个计数器
 84 addEvent.ID = 1;
 85 
 86 //执行事件处理函数
 87 addEvent.exec = function (event) {
 88     var e = event || addEvent.fixEvent(window.event);
 89     var es = this.events[e.type];
 90     for (var i in es) {
 91         es[i].call(this, e);
 92     }
 93 };
 94 
 95 //同一个注册函数进行屏蔽
 96 addEvent.equal = function (es, fn) {
 97     for (var i in es) {
 98         if (es[i] == fn) return true;
 99     }
100     return false;
101 }
102 
103 //把IE常用的Event对象配对到W3C中去
104 addEvent.fixEvent = function (event) {
105     event.preventDefault = addEvent.fixEvent.preventDefault;
106     event.stopPropagation = addEvent.fixEvent.stopPropagation;
107     event.target = event.srcElement;
108     return event;
109 };
110 
111 //IE阻止默认行为
112 addEvent.fixEvent.preventDefault = function () {
113     this.returnValue = false;
114 };
115 
116 //IE取消冒泡
117 addEvent.fixEvent.stopPropagation = function () {
118     this.cancelBubble = true;
119 };
120 
121 
122 //跨浏览器删除事件
123 function removeEvent(obj, type, fn) {
124     if (typeof obj.removeEventListener != ‘undefined‘) {
125         obj.removeEventListener(type, fn, false);
126     } else {
127         if (obj.events) {
128             for (var i in obj.events[type]) {
129                 if (obj.events[type][i] == fn) {
130                     delete obj.events[type][i];
131                 }
132             }
133         }
134     }
135 }
136 
137 
138 //跨浏览器获取视口大小
139 function getInner() {
140     if (typeof window.innerWidth != ‘undefined‘) {
141         return {
142             width : window.innerWidth,
143             height : window.innerHeight
144         }
145     } else {
146         return {
147             width : document.documentElement.clientWidth,
148             height : document.documentElement.clientHeight
149         }
150     }
151 }
152 
153 //跨浏览器获取滚动条位置
154 function getScroll() {
155     return {
156         top : document.documentElement.scrollTop || document.body.scrollTop,
157         left : document.documentElement.scrollLeft || document.body.scrollLeft
158     }
159 }
160 
161 
162 //跨浏览器获取Style
163 function getStyle(element, attr) {
164     var value;
165     if (typeof window.getComputedStyle != ‘undefined‘) {//W3C
166         value = window.getComputedStyle(element, null)[attr];
167     } else if (typeof element.currentStyle != ‘undeinfed‘) {//IE
168         value = element.currentStyle[attr];
169     }
170     return value;
171 }
172 
173 
174 //判断class是否存在
175 function hasClass(element, className) {
176     return element.className.match(new RegExp(‘(\\s|^)‘ +className +‘(\\s|$)‘));
177 }
178 
179 
180 //跨浏览器添加link规则
181 function insertRule(sheet, selectorText, cssText, position) {
182     if (typeof sheet.insertRule != ‘undefined‘) {//W3C
183         sheet.insertRule(selectorText + ‘{‘ + cssText + ‘}‘, position);
184     } else if (typeof sheet.addRule != ‘undefined‘) {//IE
185         sheet.addRule(selectorText, cssText, position);
186     }
187 }
188 
189 //跨浏览器移出link规则
190 function deleteRule(sheet, index) {
191     if (typeof sheet.deleteRule != ‘undefined‘) {//W3C
192         sheet.deleteRule(index);
193     } else if (typeof sheet.removeRule != ‘undefined‘) {//IE
194         sheet.removeRule(index);
195     }
196 }
197 
198 //跨浏览器获取innerText
199 function getInnerText(element) {
200     return (typeof element.textContent == ‘string‘) ? element.textContent : element.innerText;
201 }
202 
203 //跨浏览器设置innerText
204 function setInnerText(elememt, text) {
205     if (typeof element.textContent == ‘string‘) {
206         element.textContent = text;
207     } else {
208         element.innerText = text;
209     }
210 }
211 
212 //获取某一个元素到最外层顶点的位置
213 function offsetTop(element) {
214     var top = element.offsetTop;
215     var parent = element.offsetParent;
216     while (parent != null) {
217         top += parent.offsetTop;
218         parent = parent.offsetParent;
219     }
220     return top;
221 }
222 
223 //删除左后空格
224 function trim(str) {
225     return str.replace(/(^\s*)|(\s*$)/g, ‘‘);
226 }
227 
228 //某一个值是否存在某一个数组中
229 function inArray(array, value) {
230     for (var i in array) {
231         if (array[i] === value) return true;
232     }
233     return false;
234 }
235 
236 //获取某一个节点的上一个节点的索引
237 function prevIndex(current, parent) {
238     var currentNum  = parseInt(current);
239     var length = parent.children.length;
240     if (currentNum == 0) return length - 1;
241     return currentNum - 1;
242 }
243 
244 //获取某一个节点的下一个节点的索引
245 function nextIndex(current, parent) {
246     var currentNum  = parseInt(current);
247     var length = parent.children.length;
248     if (currentNum == length - 1) return 0;
249     return currentNum + 1;
250 }
251 //滚动条固定
252 function fixedScroll() {
253     window.scrollTo(fixedScroll.left, fixedScroll.top);
254 }
255 
256 //阻止默认行为
257 function predef(e) {
258     e.preventDefault();
259 }
260 
261 /*
262  * 跨浏览器基础库 end===============================================
263  * */
264 /*
265  * 功能库===============================================
266  * */
267 
268 
269 
270 //前台调用
271 var $ = function (args) {
272     return new Base(args);
273 }
274 
275 //基础库
276 function Base(args) {
277     //创建一个数组，来保存获取的节点和节点数组
278     this.elements = [];
279 
280     if (typeof args == ‘string‘) {
281         //css模拟
282         if (args.indexOf(‘ ‘) != -1) {
283             var elements = args.split(‘ ‘);            //把节点拆开分别保存到数组里
284             var childElements = [];                    //存放临时节点对象的数组，解决被覆盖的问题
285             var node = [];                                //用来存放父节点用的
286             for (var i = 0; i < elements.length; i ++) {
287                 if (node.length == 0) node.push(document);        //如果默认没有父节点，就把document放入
288                 switch (elements[i].charAt(0)) {
289                     case ‘#‘ :
290                         childElements = [];                //清理掉临时节点，以便父节点失效，子节点有效
291                         childElements.push(this.getId(elements[i].substring(1)));
292                         node = childElements;        //保存父节点，因为childElements要清理，所以需要创建node数组
293                         break;
294                     case ‘.‘ :
295                         childElements = [];
296                         for (var j = 0; j < node.length; j ++) {
297                             var temps = this.getClass(elements[i].substring(1), node[j]);
298                             for (var k = 0; k < temps.length; k ++) {
299                                 childElements.push(temps[k]);
300                             }
301                         }
302                         node = childElements;
303                         break;
304                     default :
305                         childElements = [];
306                         for (var j = 0; j < node.length; j ++) {
307                             var temps = this.getTagName(elements[i], node[j]);
308                             for (var k = 0; k < temps.length; k ++) {
309                                 childElements.push(temps[k]);
310                             }
311                         }
312                         node = childElements;
313                 }
314             }
315             this.elements = childElements;
316         } else {
317             //find模拟
318             switch (args.charAt(0)) {
319                 case ‘#‘ :
320                     this.elements.push(this.getId(args.substring(1)));
321                     break;
322                 case ‘.‘ :
323                     this.elements = this.getClass(args.substring(1));
324                     break;
325                 default :
326                     this.elements = this.getTagName(args);
327             }
328         }
329     } else if (typeof args == ‘object‘) {
330         if (args != undefined) {    //_this是一个对象，undefined也是一个对象，区别与typeof返回的带单引号的‘undefined‘
331             this.elements[0] = args;
332         }
333     } else if (typeof args == ‘function‘) {
334         this.ready(args);
335     }
336 }
337 
338 //addDomLoaded
339 Base.prototype.ready = function (fn) {
340     addDomLoaded(fn);
341 };
342 
343 //获取ID节点
344 Base.prototype.getId = function (id) {
345     return document.getElementById(id)
346 };
347 
348 //获取元素节点数组
349 Base.prototype.getTagName = function (tag, parentNode) {
350     var node = null;
351     var temps = [];
352     if (parentNode != undefined) {
353         node = parentNode;
354     } else {
355         node = document;
356     }
357     var tags = node.getElementsByTagName(tag);
358     for (var i = 0; i < tags.length; i ++) {
359         temps.push(tags[i]);
360     }
361     return temps;
362 };
363 
364 //获取CLASS节点数组
365 Base.prototype.getClass = function (className, parentNode) {
366     var node = null;
367     var temps = [];
368     if (parentNode != undefined) {
369         node = parentNode;
370     } else {
371         node = document;
372     }
373     var all = node.getElementsByTagName(‘*‘);
374     for (var i = 0; i < all.length; i ++) {
375         if ((new RegExp(‘(\\s|^)‘ +className +‘(\\s|$)‘)).test(all[i].className)) {
376             temps.push(all[i]);
377         }
378     }
379     return temps;
380 }
381 
382 //设置CSS选择器子节点
383 Base.prototype.find = function (str) {
384     var childElements = [];
385     for (var i = 0; i < this.elements.length; i ++) {
386         switch (str.charAt(0)) {
387             case ‘#‘ :
388                 childElements.push(this.getId(str.substring(1)));
389                 break;
390             case ‘.‘ :
391                 var temps = this.getClass(str.substring(1), this.elements[i]);
392                 for (var j = 0; j < temps.length; j ++) {
393                     childElements.push(temps[j]);
394                 }
395                 break;
396             default :
397                 var temps = this.getTagName(str, this.elements[i]);
398                 for (var j = 0; j < temps.length; j ++) {
399                     childElements.push(temps[j]);
400                 }
401         }
402     }
403     this.elements = childElements;
404     return this;
405 }
406 
407 //获取某一个节点，并返回这个节点对象
408 Base.prototype.ge = function (num) {
409     return this.elements[num];
410 };
411 
412 //获取首个节点，并返回这个节点对象
413 Base.prototype.first = function () {
414     return this.elements[0];
415 };
416 
417 //获取末个节点，并返回这个节点对象
418 Base.prototype.last = function () {
419     return this.elements[this.elements.length - 1];
420 };
421 
422 //获取某组节点的数量
423 Base.prototype.length = function () {
424     return this.elements.length;
425 };
426 
427 //获取某一个节点的属性
428 Base.prototype.attr = function (attr, value) {
429     for (var i = 0; i < this.elements.length; i ++) {
430         if (arguments.length == 1) {
431             return this.elements[i].getAttribute(attr);
432         } else if (arguments.length == 2) {
433             this.elements[i].setAttribute(attr, value);
434         }
435     }
436     return this;
437 };
438 
439 //获取某一个节点在整个节点组中是第几个索引
440 Base.prototype.index = function () {
441     var children = this.elements[0].parentNode.children;
442     for (var i = 0; i < children.length; i ++) {
443         if (this.elements[0] == children[i]) return i;
444     }
445 };
446 
447 //设置某一个节点的透明度
448 Base.prototype.opacity = function (num) {
449     for (var i = 0; i < this.elements.length; i ++) {
450         this.elements[i].style.opacity = num / 100;
451         this.elements[i].style.filter = ‘alpha(opacity=‘ + num + ‘)‘;
452     }
453     return this;
454 };
455 
456 //获取某一个节点，并且Base对象
457 Base.prototype.eq = function (num) {
458     var element = this.elements[num];
459     this.elements = [];
460     this.elements[0] = element;
461     return this;
462 };
463 
464 //获取当前节点的下一个元素节点
465 Base.prototype.next = function () {
466     for (var i = 0; i < this.elements.length; i ++) {
467         this.elements[i] = this.elements[i].nextSibling;
468         if (this.elements[i] == null) throw new Error(‘找不到下一个同级元素节点！‘);
469         if (this.elements[i].nodeType == 3) this.next();
470     }
471     return this;
472 };
473 
474 //获取当前节点的上一个元素节点
475 Base.prototype.prev = function () {
476     for (var i = 0; i < this.elements.length; i ++) {
477         this.elements[i] = this.elements[i].previousSibling;
478         if (this.elements[i] == null) throw new Error(‘找不到上一个同级元素节点！‘);
479         if (this.elements[i].nodeType == 3) this.prev();
480     }
481     return this;
482 };
483 
484 //设置CSS
485 Base.prototype.css = function (attr, value) {
486     for (var i = 0; i < this.elements.length; i ++) {
487         if (arguments.length == 1) {
488             return getStyle(this.elements[i], attr);
489         }
490         this.elements[i].style[attr] = value;
491     }
492     return this;
493 }
494 
495 //添加Class
496 Base.prototype.addClass = function (className) {
497     for (var i = 0; i < this.elements.length; i ++) {
498         if (!hasClass(this.elements[i], className)) {
499             this.elements[i].className += ‘ ‘ + className;
500         }
501     }
502     return this;
503 }
504 
505 //移除Class
506 Base.prototype.removeClass = function (className) {
507     for (var i = 0; i < this.elements.length; i ++) {
508         if (hasClass(this.elements[i], className)) {
509             this.elements[i].className = this.elements[i].className.replace(new RegExp(‘(\\s|^)‘ +className +‘(\\s|$)‘), ‘ ‘);
510         }
511     }
512     return this;
513 }
514 
515 //添加link或style的CSS规则
516 Base.prototype.addRule = function (num, selectorText, cssText, position) {
517     var sheet = document.styleSheets[num];
518     insertRule(sheet, selectorText, cssText, position);
519     return this;
520 }
521 
522 //移除link或style的CSS规则
523 Base.prototype.removeRule = function (num, index) {
524     var sheet = document.styleSheets[num];
525     deleteRule(sheet, index);
526     return this;
527 }
528 
529 //设置表单字段元素
530 Base.prototype.form = function (name) {
531     for (var i = 0; i < this.elements.length; i ++) {
532         this.elements[i] = this.elements[i][name];
533     }
534     return this;
535 };
536 
537 //设置表单字段内容获取
538 Base.prototype.value = function (str) {
539     for (var i = 0; i < this.elements.length; i ++) {
540         if (arguments.length == 0) {
541             return this.elements[i].value;
542         }
543         this.elements[i].value = str;
544     }
545     return this;
546 }
547 
548 //设置innerHTML
549 Base.prototype.html = function (str) {
550     for (var i = 0; i < this.elements.length; i ++) {
551         if (arguments.length == 0) {
552             return this.elements[i].innerHTML;
553         }
554         this.elements[i].innerHTML = str;
555     }
556     return this;
557 }
558 
559 //设置innerText
560 Base.prototype.text = function (str) {
561     for (var i = 0; i < this.elements.length; i ++) {
562         if (arguments.length == 0) {
563             return getInnerText(this.elements[i]);
564         }
565         setInnerText(this.elements[i], text);
566     }
567     return this;
568 }
569 
570 //设置事件发生器
571 Base.prototype.bind = function (event, fn) {
572     for (var i = 0; i < this.elements.length; i ++) {
573         addEvent(this.elements[i], event, fn);
574     }
575     return this;
576 };
577 
578 //设置鼠标移入移出方法
579 Base.prototype.hover = function (over, out) {
580     for (var i = 0; i < this.elements.length; i ++) {
581         addEvent(this.elements[i], ‘mouseover‘, over);
582         addEvent(this.elements[i], ‘mouseout‘, out);
583     }
584     return this;
585 };
586 
587 //设置点击切换方法
588 Base.prototype.toggle = function () {
589     for (var i = 0; i < this.elements.length; i ++) {
590         (function (element, args) {
591             var count = 0;
592             addEvent(element, ‘click‘, function () {
593                 args[count++ % args.length].call(this);
594             });
595         })(this.elements[i], arguments);
596     }
597     return this;
598 };
599 
600 //设置显示
601 Base.prototype.show = function () {
602     for (var i = 0; i < this.elements.length; i ++) {
603         this.elements[i].style.display = ‘block‘;
604     }
605     return this;
606 };
607 
608 //设置隐藏
609 Base.prototype.hide = function () {
610     for (var i = 0; i < this.elements.length; i ++) {
611         this.elements[i].style.display = ‘none‘;
612     }
613     return this;
614 };
615 
616 //设置物体居中
617 Base.prototype.center = function (width, height) {
618     var top = (getInner().height - height) / 2 + getScroll().top;
619     var left = (getInner().width - width) / 2 + getScroll().left;
620     for (var i = 0; i < this.elements.length; i ++) {
621         this.elements[i].style.top = top + ‘px‘;
622         this.elements[i].style.left = left + ‘px‘;
623     }
624     return this;
625 };
626 
627 //锁屏功能
628 Base.prototype.lock = function () {
629     for (var i = 0; i < this.elements.length; i ++) {
630         fixedScroll.top = getScroll().top;
631         fixedScroll.left = getScroll().left;
632         this.elements[i].style.width = getInner().width + getScroll().left + ‘px‘;
633         this.elements[i].style.height = getInner().height + getScroll().top + ‘px‘;
634         this.elements[i].style.display = ‘block‘;
635         parseFloat(sys.firefox) < 4 ? document.body.style.overflow = ‘hidden‘ : document.documentElement.style.overflow = ‘hidden‘;
636         addEvent(this.elements[i], ‘mousedown‘, predef);
637         addEvent(this.elements[i], ‘mouseup‘, predef);
638         addEvent(this.elements[i], ‘selectstart‘, predef);
639         addEvent(window, ‘scroll‘, fixedScroll);
640     }
641     return this;
642 };
643 
644 Base.prototype.unlock = function () {
645     for (var i = 0; i < this.elements.length; i ++) {
646         this.elements[i].style.display = ‘none‘;
647         parseFloat(sys.firefox) < 4 ? document.body.style.overflow = ‘auto‘ : document.documentElement.style.overflow = ‘auto‘;
648         removeEvent(this.elements[i], ‘mousedown‘, predef);
649         removeEvent(this.elements[i], ‘mouseup‘, predef);
650         removeEvent(this.elements[i], ‘selectstart‘, predef);
651         removeEvent(window, ‘scroll‘, fixedScroll);
652     }
653     return this;
654 };
655 
656 //触发点击事件
657 Base.prototype.click = function (fn) {
658     for (var i = 0; i < this.elements.length; i ++) {
659         this.elements[i].onclick = fn;
660     }
661     return this;
662 };
663 
664 //触发浏览器窗口事件
665 Base.prototype.resize = function (fn) {
666     for (var i = 0; i < this.elements.length; i ++) {
667         var element = this.elements[i];
668         addEvent(window, ‘resize‘, function () {
669             fn();
670             if (element.offsetLeft > getInner().width + getScroll().left - element.offsetWidth) {
671                 element.style.left = getInner().width + getScroll().left - element.offsetWidth + ‘px‘;
672                 if (element.offsetLeft <= 0 + getScroll().left) {
673                     element.style.left = 0 + getScroll().left + ‘px‘;
674                 }
675             }
676             if(element.offsetTop > getInner().height + getScroll().top - element.offsetHeight) {
677                 element.style.top = getInner().height + getScroll().top - element.offsetHeight + ‘px‘;
678                 if (element.offsetTop <= 0 + getScroll().top) {
679                     element.style.top = 0 + getScroll().top + ‘px‘;
680                 }
681             }
682         });
683     }
684     return this;
685 };
686 
687 //设置动画
688 Base.prototype.animate = function (obj) {
689     for (var i = 0; i < this.elements.length; i ++) {
690         var element = this.elements[i];
691         var attr = obj[‘attr‘] == ‘x‘ ? ‘left‘ : obj[‘attr‘] == ‘y‘ ? ‘top‘ :
692                 obj[‘attr‘] == ‘w‘ ? ‘width‘ : obj[‘attr‘] == ‘h‘ ? ‘height‘ :
693                 obj[‘attr‘] == ‘o‘ ? ‘opacity‘ : obj[‘attr‘] != undefined ? obj[‘attr‘] : ‘left‘;
694 
695 
696         var start = obj[‘start‘] != undefined ? obj[‘start‘] :
697                 attr == ‘opacity‘ ? parseFloat(getStyle(element, attr)) * 100 :
698             parseInt(getStyle(element, attr));
699 
700         var t = obj[‘t‘] != undefined ? obj[‘t‘] : 10;                                                //可选，默认10毫秒执行一次
701         var step = obj[‘step‘] != undefined ? obj[‘step‘] : 20;                                //可选，每次运行10像素
702 
703         var alter = obj[‘alter‘];
704         var target = obj[‘target‘];
705         var mul = obj[‘mul‘];
706 
707         var speed = obj[‘speed‘] != undefined ? obj[‘speed‘] : 6;                            //可选，默认缓冲速度为6
708         var type = obj[‘type‘] == 0 ? ‘constant‘ : obj[‘type‘] == 1 ? ‘buffer‘ : ‘buffer‘;        //可选，0表示匀速，1表示缓冲，默认缓冲
709 
710 
711         if (alter != undefined && target == undefined) {
712             target = alter + start;
713         } else if (alter == undefined && target == undefined && mul == undefined) {
714             throw new Error(‘alter增量或target目标量必须传一个！‘);
715         }
716 
717 
718 
719         if (start > target) step = -step;
720 
721         if (attr == ‘opacity‘) {
722             element.style.opacity = parseInt(start) / 100;
723             element.style.filter = ‘alpha(opacity=‘ + parseInt(start) +‘)‘;
724         } else {
725             //element.style[attr] = start + ‘px‘;
726         }
727 
728 
729         if (mul == undefined) {
730             mul = {};
731             mul[attr] = target;
732         }
733 
734 
735         clearInterval(element.timer);
736         element.timer = setInterval(function () {
737 
738             /*
739              问题1：多个动画执行了多个列队动画，我们要求不管多少个动画只执行一个列队动画
740              问题2：多个动画数值差别太大，导致动画无法执行到目标值，原因是定时器提前清理掉了
741 
742              解决1：不管多少个动画，只提供一次列队动画的机会
743              解决2：多个动画按最后一个分动画执行完毕后再清理即可
744              */
745 
746             //创建一个布尔值，这个值可以了解多个动画是否全部执行完毕
747             var flag = true; //表示都执行完毕了
748 
749 
750             for (var i in mul) {
751                 attr = i == ‘x‘ ? ‘left‘ : i == ‘y‘ ? ‘top‘ : i == ‘w‘ ? ‘width‘ : i == ‘h‘ ? ‘height‘ : i == ‘o‘ ? ‘opacity‘ : i != undefined ? i : ‘left‘;
752                 target = mul[i];
753 
754 
755                 if (type == ‘buffer‘) {
756                     step = attr == ‘opacity‘ ? (target - parseFloat(getStyle(element, attr)) * 100) / speed :
757                         (target - parseInt(getStyle(element, attr))) / speed;
758                     step = step > 0 ? Math.ceil(step) : Math.floor(step);
759                 }
760 
761 
762 
763                 if (attr == ‘opacity‘) {
764                     if (step == 0) {
765                         setOpacity();
766                     } else if (step > 0 && Math.abs(parseFloat(getStyle(element, attr)) * 100 - target) <= step) {
767                         setOpacity();
768                     } else if (step < 0 && (parseFloat(getStyle(element, attr)) * 100 - target) <= Math.abs(step)) {
769                         setOpacity();
770                     } else {
771                         var temp = parseFloat(getStyle(element, attr)) * 100;
772                         element.style.opacity = parseInt(temp + step) / 100;
773                         element.style.filter = ‘alpha(opacity=‘ + parseInt(temp + step) + ‘)‘;
774                     }
775 
776                     if (parseInt(target) != parseInt(parseFloat(getStyle(element, attr)) * 100)) flag = false;
777 
778                 } else {
779                     if (step == 0) {
780                         setTarget();
781                     } else if (step > 0 && Math.abs(parseInt(getStyle(element, attr)) - target) <= step) {
782                         setTarget();
783                     } else if (step < 0 && (parseInt(getStyle(element, attr)) - target) <= Math.abs(step)) {
784                         setTarget();
785                     } else {
786                         element.style[attr] = parseInt(getStyle(element, attr)) + step + ‘px‘;
787                     }
788 
789                     if (parseInt(target) != parseInt(getStyle(element, attr))) flag = false;
790                 }
791 
792                 //document.getElementById(‘test‘).innerHTML += i + ‘--‘ + parseInt(target) + ‘--‘ + parseInt(getStyle(element, attr)) + ‘--‘ + flag + ‘<br />‘;
793 
794             }
795 
796             if (flag) {
797                 clearInterval(element.timer);
798                 if (obj.fn != undefined) obj.fn();
799             }
800 
801         }, t);
802 
803         function setTarget() {
804             element.style[attr] = target + ‘px‘;
805         }
806 
807         function setOpacity() {
808             element.style.opacity = parseInt(target) / 100;
809             element.style.filter = ‘alpha(opacity=‘ + parseInt(target) + ‘)‘;
810         }
811     }
812     return this;
813 };
814 
815 //插件入口
816 Base.prototype.extend = function (name, fn) {
817     Base.prototype[name] = fn;
818 };