js

var Ex = function (o)

{ for (var k in o) this[k] = o[k]; return this }

//遍历这个o对象中的所有属性;

var UI = function (id) { return document.getElementById(id) }

/////返回某个对象下的某个标签集合;

////UIs此时是个数组类型;

var UIs=function (tag){return Ex.call([],this.getElementsByTagName(tag))}

var Each = function (a, fn) { for (var i = 0; i < a.length; i++) fn.call(a[i], i, a) }

//fn调用数组中每一个元素作为参数;

var dhooo=function (ini){ this.bind(ini,this); this.autoIndex=0; };

//调用自己内部的bind prototype方法.//定义自己对象的一个autoIndex属性;

//调用Ex公用方法,进行定义dhooo这个对象的两个prototype方法,并返回dhooo这个对象;

Ex.call(dhooo.prototype, { //bind的原型方法;

//ini参数代表自己临时顶替dhoo0的一个对象,me参数代表dhooo自己这个对象;  

   bind: function (ini, me) {  

//滚动的方向是向上么,是的话, 那么dir=scrollTop,不然就等于scrollLeft;

//利用UI公用函数取得ini中contentId属性的ID.调用的父容器;

        var dir = ini.dir == 'top' ? 'scrollTop' : 'scrollLeft', pan = UI(ini.contentID);  

//定义start方法为bind函数的内部方法;

 //ini.btns值是一个数值,利用Each方法,将  

//匿名函数调用ini.btns这个数组的元素作为参数传给自己,这里this实际代表ini.btns里的一个元素;

var start=function (o){ Each(ini.btns,function(){this.className=''}); o.className = ini.className;

//这个对象的className=ini的class me.autoIndex = o.index;

//父对象调用自己的begin prototype方法,开始跑了..

//begin参数为'跑在第几个','显示的容器是那个','总共有几个','往那个方向滚动';

me.begin(o.index,pan,ini.len,dir); };

//当显示的容器受鼠标划过时.me对象就要暂停;

pan.onmouseover=function (){me.stop=true};

Each(ini.btns,function (i){ this.index=i; this.onmouseover=function (){me.stop=true;start(this)};

pan.onmouseout=this.onmouseout=function(){me.stop=false} });

var auto=function(){    

if (!me.stop) {

//超过4时,重置为0;并让

me.autoIndex=+me.autoIndex; me.autoIndex=me.autoIndex==4?0:++me.autoIndex; start(ini.btns[me.autoIndex]); } };

//如果处于自动姿态,那么一秒后,自动在执行一次;

if(ini.auto)this.autoPlay=window.setInterval(auto,1000); }

//i代表当前显示的第几个,步长,总共几个.方向; ,

begin:function (i,o,len,dir){ (function (me){     clearInterval(me.only);

//清除定时一下;防止占用过高的cpu;

me.only=setInterval(function ()

{ var diff=(i*len-o[dir])*0.1; o[dir]+=Math[diff>0?'ceil':'floor'](diff); if(diff==0)clearInterval(me.only); },10) })(this) } })

//作图的鼠标轮换 new dhooo({ btns:UIs.call(UI('myTab_btns1'),'LI') ,className:'hot' ,contentID:'main1' ,len:360 });

//右图的鼠标轮换 new dhooo({ btns:UIs.call(UI('myTab_btns2'),'LI') ,className:'hot' ,contentID:'main2' ,len:190 ,dir:'top' ,auto:true });

posted @ 2013-09-01 10:03  mythp  阅读(190)  评论(0编辑  收藏  举报