很棒的时间线控件
原生态javascript，希望大家能喜欢function Gametimeline(){var c=document,a=arguments.callee,b=this;b.parent=c.getElementById("GameModuleTimeline"),b.hand=c.getElementById("GametimelineHandler"),b.handler=b.hand.getElementsByTagName("b"),b.date=b.hand.getElementsByTagName("span"),b.container=c.getElementById("GameModuleTimelineContainer"),b.pointer=c.getElementById("GametimelinePointer");!a.cache&&(a.cache=[[],[],[]]);if(b.container.children.length!==b.handler.length){return false}!this.parseDate&&(a.prototype.parseDate=function(){var g=0,d=b.handler.length,e=[];for(;g<d;){var h=b.handler,f=new Function("return"+("["+b.date.innerHTML.replace(/\./gi,",")+"]"))();b=+new Date(f,f,f);b.length=g;h.style.left="";void function(i,k){b.addEvent(k,"mouseover",function(){b.activity.call(k,i)},false)}(g++,h)}return b});a.prototype.locateHandler=function(){var f=(b-b)/86400000,g=0,d=b.handler.length,e=0;for(;g<d;){e=((b-b)/(f*86400000))*b.parent.offsetWidth;b.fx(b.handler,"left",((g===d-1||g===0)?e-20:e),50);g++}};a.prototype.Linear=function(f,e,h,g){if((f/=g)<(1/2.75)){return h*(7.5625*f*f)+e}else{if(f<(2/2.75)){return h*(7.5625*(f-=(1.5/2.75))*f+0.75)+e}else{if(f<(2.5/2.75)){return h*(7.5625*(f-=(2.25/2.75))*f+0.9375)+e}else{return h*(7.5625*(f-=(2.625/2.75))*f+0.984375)+e}}}};a.prototype.fx=function(e,p,m,l){var n=0,m=m||50,l=l||100,q=0,f=0,g=10,h=0;void function(){e.style=Math.ceil(b.Linear(q,n,m,l))+"px";if(parseInt(e.style)<m){q++;setTimeout(arguments.callee,10)}}()};a.prototype.activity=function(g){var j=Array.prototype.slice,f=b.date,h=f,e=b.container,k=e.children,i=b.getClinetRect(this),d=b.getClinetRect(b.container);!a.cache&&(a.cache="visibility:visible;left:"+(parseInt(this.style.left)-f.offsetWidth/2+this.offsetWidth/2+"px"));if(!a.cache){if((i.left-k.offsetWidth/2)<d.left){a.cache="visibility:visible;left:0px;"}else{if((i.left+k.offsetWidth/2)>d.right){a.cache="visibility:visible;left:"+(d.right-k.offsetWidth-d.left)+"px;"}else{a.cache="visibility:visible;left:"+(i.left-k.offsetWidth/2-d.left)+"px;"}}}!a.cache&&(a.cache=("visibility:visible;left:"+(parseInt(this.style.left)-b.pointer.offsetWidth/2+this.offsetWidth/2)+"px; z-index:60;"));b.off.call(this,g);this.className="GametimelineOn";h.style.cssText=a.cache;b.fx(h,"top",15,80);!window.ActiveXObject&&(b.fadeIn.call(h,50),b.fadeIn.call(k,50));k.style.cssText=a.cache;b.pointer.style.cssText=a.cache};a.prototype.off=function(e){var f=0,d=b.handler.length;for(;f<d;){if(f!==e){b.date.style.visibility="hidden",b.container.children.style.visibility="hidden";b.handler.className="GametimelineOff"}f++}};a.prototype.getClinetRect=function(f){var d=f.getBoundingClientRect(),e=(e={left:d.left,right:d.right,top:d.top,bottom:d.bottom,height:(d.height?d.height:(d.bottom-d.top)),width:(d.width?d.width:(d.right-d.left))});return e};a.prototype.fadeIn=function(d,e){b.doFade.call(this,d/10,0,true,e)};a.prototype.doFade=function(d,j,i,g){var k=undefined!==window.ActiveXObject,f=arguments.callee,e=this,h;j+=(i?1:-1)/d,(i?j>1:j<0)&&(j=i?1:0),k===true?e.style.filter="alpha(opacity="+j*100+")":e.style.opacity=j;(i?j<1:j>0)&&setTimeout(function(){f.call(e,d,j,i,g)},1000/d);(i?j===1:j===0&&"undefined"!==typeof g)&&("function"===typeof g&&g.call(e))};a.prototype.addEvent=function(h,g,f,e){var d=arguments.callee;h.attachEvent&&(d=function(k,j,i){k.attachEvent("on"+j,i)}).apply(this,arguments);h.addEventListener&&(d=function(k,j,i){k.addEventListener(j,i,e||false)}).apply(this,arguments);h["on"+g]&&(d=function(k,j,i){k["on"+j]=function(){i()}}).apply(this,arguments)};a.prototype.trigger=function(f,e){var d,g=document;undefined!==g.createEvent?(d=g.createEvent("MouseEvents"),d.initMouseEvent(e,true,true,document.defaultView,0,0,0,0,0,false,false,false,false,0,null),f.dispatchEvent(d)):(d=g.createEventObject(),d.screenX=100,d.screenY=0,d.clientX=0,d.clientY=0,d.ctrlKey=false,d.altKey=false,d.shiftKey=false,d.button=false,f.fireEvent("on"+e,d))};return{init:function(d){b.parseDate();b.locateHandler();b.trigger(b.handler,"mouseover")}}};new Gametimeline().init(0);
页:
[1]