鼠标移下去显示菜单
鼠标移上去显示菜单
if (typeof document.attachEvent!='undefined') { window.attachEvent('onload',init); document.attachEvent('onmousemove',moveMouse); document.attachEvent('onclick',checkMove); } else { window.addEventListener('load',init,false); document.addEventListener('mousemove',moveMouse,false); document.addEventListener('click',checkMove,false); } var oDv=document.createElement("div"); var dvHdr=document.createElement("div"); var dvBdy=document.createElement("div"); var windowlock,boxMove,fixposx,fixposy,lockX,lockY,fixx,fixy,ox,oy,boxLeft,boxRight,boxTop,boxBottom,evt,mouseX,mouseY,boxOpen,totalScrollTop,totalScrollLeft; boxOpen=false; ox=10; oy=10; lockX=0; lockY=0; function init() { oDv.appendChild(dvHdr); oDv.appendChild(dvBdy); oDv.style.position="absolute"; oDv.style.visibility='hidden'; document.body.appendChild(oDv); } function defHdrStyle() { } function defBdyStyle() { dvBdy.style.border='1px solid #ccc';//层的边框 dvBdy.style.width='210px'; dvBdy.style.fontFamily='arial'; dvBdy.style.fontSize='14'; dvBdy.style.textAlign='left'; dvBdy.style.padding='30'; dvBdy.style.color='#000'; dvBdy.style.background='#fff'; dvBdy.style.filter='alpha(opacity=80)'; // IE dvBdy.style.opacity='0.8'; // FF } function checkElemBO(txt) { if (!txt || typeof(txt) != 'string') return false; if ((txt.indexOf('body')>-1)&&(txt.indexOf('[')>-1)&&(txt.indexOf('[')>-1)) return true; else return false; } function scanBO(curNode) { if (checkElemBO(curNode.title)) { curNode.boHDR=getParam('header',curNode.title); curNode.boBDY=getParam('body',curNode.title); curNode.boCSSBDY=getParam('cssbody',curNode.title); curNode.boCSSHDR=getParam('cssheader',curNode.title); curNode.IEbugfix=(getParam('hideselects',curNode.title)=='on')?true:false; curNode.fixX=parseInt(getParam('fixedrelx',curNode.title)); curNode.fixY=parseInt(getParam('fixedrely',curNode.title)); curNode.absX=parseInt(getParam('fixedabsx',curNode.title)); curNode.absY=parseInt(getParam('fixedabsy',curNode.title)); curNode.offY=(getParam('offsety',curNode.title)!='')?parseInt(getParam('offsety',curNode.title)):10; curNode.offX=(getParam('offsetx',curNode.title)!='')?parseInt(getParam('offsetx',curNode.title)):10; curNode.fade=(getParam('fade',curNode.title)=='on')?true:false; curNode.fadespeed=(getParam('fadespeed',curNode.title)!='')?getParam('fadespeed',curNode.title):0.04; curNode.delay=(getParam('delay',curNode.title)!='')?parseInt(getParam('delay',curNode.title)):0; if (getParam('requireclick',curNode.title)=='on') { curNode.requireclick=true; document.all?curNode.attachEvent('onclick',showHideBox):curNode.addEventListener('click',showHideBox,false); document.all?curNode.attachEvent('onmouseover',hideBox):curNode.addEventListener('mouseover',hideBox,false); } else {// Note : if requireclick is on the stop clicks are ignored if (getParam('doubleclickstop',curNode.title)!='off') { document.all?curNode.attachEvent('ondblclick',pauseBox):curNode.addEventListener('dblclick',pauseBox,false); } if (getParam('singleclickstop',curNode.title)=='on') { document.all?curNode.attachEvent('onclick',pauseBox):curNode.addEventListener('click',pauseBox,false); } } curNode.windowLock=getParam('windowlock',curNode.title).toLowerCase()=='off'?false:true; curNode.title=''; curNode.hasbox=1; } else curNode.hasbox=2; } function getParam(param,list) { var reg = new RegExp('([^a-zA-Z]' + param + '|^' + param + ')\\s*=\\s*\\[\\s*(((\\[\\[)|(\\]\\])|([^\\]\\[]))*)\\s*\\]'); var res = reg.exec(list); var returnvar; if(res) return res[2].replace('[[','[').replace(']]',']'); else return ''; } function Left(elem){ var x=0; if (elem.calcLeft) return elem.calcLeft; var oElem=elem; while(elem){ if ((elem.currentStyle)&& (!isNaN(parseInt(elem.currentStyle.borderLeftWidth)))&&(x!=0)) x+=parseInt(elem.currentStyle.borderLeftWidth); x+=elem.offsetLeft; elem=elem.offsetParent; } oElem.calcLeft=x; return x; } function Top(elem){ var x=0; if (elem.calcTop) return elem.calcTop; var oElem=elem; while(elem){ if ((elem.currentStyle)&& (!isNaN(parseInt(elem.currentStyle.borderTopWidth)))&&(x!=0)) x+=parseInt(elem.currentStyle.borderTopWidth); x+=elem.offsetTop; elem=elem.offsetParent; } oElem.calcTop=x; return x; } var ah,ab; function applyStyles() { if(ab) oDv.removeChild(dvBdy); if (ah) oDv.removeChild(dvHdr); dvHdr=document.createElement("div"); dvBdy=document.createElement("div"); CBE.boCSSBDY?dvBdy.className=CBE.boCSSBDY:defBdyStyle(); CBE.boCSSHDR?dvHdr.className=CBE.boCSSHDR:defHdrStyle(); dvHdr.innerHTML=CBE.boHDR; dvBdy.innerHTML=CBE.boBDY; ah=false; ab=false; if (CBE.boHDR!='') { oDv.appendChild(dvHdr); ah=true; } if (CBE.boBDY!=''){ oDv.appendChild(dvBdy); ab=true; } } var CSE,iterElem,LSE,CBE,LBE, totalScrollLeft, totalScrollTop, width, height ; var ini=false; // Customised function for inner window dimension function SHW() { if (document.body && (document.body.clientWidth !=0)) { width=document.body.clientWidth; height=document.body.clientHeight; } if (document.documentElement && (document.documentElement.clientWidth!=0) && (document.body.clientWidth + 20 >= document.documentElement.clientWidth)) { width=document.documentElement.clientWidth; height=document.documentElement.clientHeight; } return [width,height]; } var ID=null; function moveMouse(e) { //boxMove=true; e?evt=e:evt=event; CSE=evt.target?evt.target:evt.srcElement; if (!CSE.hasbox) { // Note we need to scan up DOM here, some elements like TR don't get triggered as srcElement iElem=CSE; while ((iElem.parentNode) && (!iElem.hasbox)) { scanBO(iElem); iElem=iElem.parentNode; } } if ((CSE!=LSE)&&(!isChild(CSE,dvHdr))&&(!isChild(CSE,dvBdy))){ if (!CSE.boxItem) { iterElem=CSE; while ((iterElem.hasbox==2)&&(iterElem.parentNode)) iterElem=iterElem.parentNode; CSE.boxItem=iterElem; } iterElem=CSE.boxItem; if (CSE.boxItem&&(CSE.boxItem.hasbox==1)) { LBE=CBE; CBE=iterElem; if (CBE!=LBE) { applyStyles(); if (!CBE.requireclick) if (CBE.fade) { if (ID!=null) clearTimeout(ID); ID=setTimeout("fadeIn("+CBE.fadespeed+")",CBE.delay); } else { if (ID!=null) clearTimeout(ID); COL=1; ID=setTimeout("oDv.style.visibility='visible';ID=null;",CBE.delay); } if (CBE.IEbugfix) {hideSelects();} fixposx=!isNaN(CBE.fixX)?Left(CBE)+CBE.fixX:CBE.absX; fixposy=!isNaN(CBE.fixY)?Top(CBE)+CBE.fixY:CBE.absY; lockX=0; lockY=0; boxMove=true; ox=CBE.offX?CBE.offX:10; oy=CBE.offY?CBE.offY:10; } } else if (!isChild(CSE,dvHdr) && !isChild(CSE,dvBdy) && (boxMove)) { // The conditional here fixes flickering between tables cells. if ((!isChild(CBE,CSE)) || (CSE.tagName!='TABLE')) { CBE=null; if (ID!=null) clearTimeout(ID); fadeOut(); showSelects(); } } LSE=CSE; } else if (((isChild(CSE,dvHdr) || isChild(CSE,dvBdy))&&(boxMove))) { totalScrollLeft=0; totalScrollTop=0; iterElem=CSE; while(iterElem) { if(!isNaN(parseInt(iterElem.scrollTop))) totalScrollTop+=parseInt(iterElem.scrollTop); if(!isNaN(parseInt(iterElem.scrollLeft))) totalScrollLeft+=parseInt(iterElem.scrollLeft); iterElem=iterElem.parentNode; } if (CBE!=null) { boxLeft=Left(CBE)-totalScrollLeft; boxRight=parseInt(Left(CBE)+CBE.offsetWidth)-totalScrollLeft; boxTop=Top(CBE)-totalScrollTop; boxBottom=parseInt(Top(CBE)+CBE.offsetHeight)-totalScrollTop; doCheck(); } } if (boxMove&&CBE) { // This added to alleviate bug in IE6 w.r.t DOCTYPE bodyScrollTop=document.documentElement&&document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop; bodyScrollLet=document.documentElement&&document.documentElement.scrollLeft?document.documentElement.scrollLeft:document.body.scrollLeft; mouseX=evt.pageX?evt.pageX-bodyScrollLet:evt.clientX-document.body.clientLeft; mouseY=evt.pageY?evt.pageY-bodyScrollTop:evt.clientY-document.body.clientTop; if ((CBE)&&(CBE.windowLock)) { mouseY < -oy?lockY=-mouseY-oy:lockY=0; mouseX < -ox?lockX=-mouseX-ox:lockX=0; mouseY > (SHW()[1]-oDv.offsetHeight-oy)?lockY=-mouseY+SHW()[1]-oDv.offsetHeight-oy:lockY=lockY; mouseX > (SHW()[0]-dvBdy.offsetWidth-ox)?lockX=-mouseX-ox+SHW()[0]-dvBdy.offsetWidth:lockX=lockX; } oDv.style.left=((fixposx)||(fixposx==0))?fixposx:bodyScrollLet+mouseX+ox+lockX+"px"; oDv.style.top=((fixposy)||(fixposy==0))?fixposy:bodyScrollTop+mouseY+oy+lockY+"px"; } } function doCheck() { if ( (mouseX < boxLeft) || (mouseX >boxRight) || (mouseY < boxTop) || (mouseY > boxBottom)) { if (!CBE.requireclick) fadeOut(); if (CBE.IEbugfix) {showSelects();} CBE=null; } } function pauseBox(e) { e?evt=e:evt=event; boxMove=false; evt.cancelBubble=true; } function showHideBox(e) { oDv.style.visibility=(oDv.style.visibility!='visible')?'visible':'hidden'; } function hideBox(e) { oDv.style.visibility='hidden'; } var COL=0; var stopfade=false; function fadeIn(fs) { ID=null; COL=0; oDv.style.visibility='visible'; fadeIn2(fs); } function fadeIn2(fs) { COL=COL+fs; COL=(COL>1)?1:COL; oDv.style.filter='alpha(opacity='+parseInt(100*COL)+')'; oDv.style.opacity=COL; if (COL<1) setTimeout("fadeIn2("+fs+")",20); } function fadeOut() { oDv.style.visibility='hidden'; } function isChild(s,d) { while(s) { if (s==d) return true; s=s.parentNode; } return false; } var cSrc; function checkMove(e) { e?evt=e:evt=event; cSrc=evt.target?evt.target:evt.srcElement; if ((!boxMove)&&(!isChild(cSrc,oDv))) { fadeOut(); if (CBE&&CBE.IEbugfix) {showSelects();} boxMove=true; CBE=null; } } function showSelects(){ var elements = document.getElementsByTagName("select"); for (i=0;i< elements.length;i++){ elements[i].style.visibility='visible'; } } function hideSelects(){ var elements = document.getElementsByTagName("select"); for (i=0;i< elements.length;i++){ elements[i].style.visibility='hidden'; } } 引用title="body=[这里是南京***B公司历史记录喔~~~]"
<html> <head> <title>www.bx115.com</title> <style type="text/css"> body {cursor:crosshair; background:#111; margin:0; padding:0; position:absolute; overflow:hidden; left:0; top:0; width:100%; height:100%;} .link {position:absolute;left:0;width:100%;height:0;background:#000;overflow:hidden;visibility:hidden;} .title {position:relative;cursor:pointer;background:#333;width:100%;color:#fff;font-family:verdana;font-size:11px;left:2;height:15;overflow:hidden;} .title_o {position:relative;cursor:pointer;background:#fff;width:100%;color:#000;font-family:verdana;font-size:11px;left:2;height:15;overflow:hidden;} .text {position:relative;text-align:justify;margin:10px;font-family:verdana;font-size:11px;color:#FFF;overflow:hidden;height:90%} </style> <script type="text/javascript"><!-- var object = new Array(); function Slide(N,oCont){ this.N = N; this.S = 1.1; this.object = new Array(); this.CObj = function (parent,N){ this.parent = parent; this.N = N; this.obj = parent.frm[N]; this.tit = this.obj.firstChild; this.div = this.obj.getElementsByTagName("div")[1]; this.div.style.visibility = "hidden"; this.y0 = N * 18; this.Y1 = this.y0; this.obj.style.top = this.y0; this.obj.style.height = parent.H - (parent.NF-1) * 18 - 3; this.obj.style.visibility = "visible"; this.obj.parent = this; this.run = false; this.move = function(){ with(this){ dy = (y1-y0)/parent.S; if(Math.abs(dy)>.1){ y0+=dy; obj.style.top = Math.round(y0); setTimeout("object["+parent.N+"].object["+N+"].move();", 16); } else { run = false; if(dy>0)div.style.visibility="hidden"; else if(N>0)parent.object[N-1].div.style.visibility="hidden"; } } } this.obj.onmouseover = function(){ with(this.parent){ if(!run){ run = true; div.style.visibility="visible"; for(i=0;i<parent.NF;i++)parent.object[i].tit.className = "title"; tit.className = "title_o"; for(i=0;i<=N;i++){ parent.object[i].y1 = i*18; parent.object[i].move(); } for(i=N+1;i<parent.NF;i++){ parent.object[i].y1 = parent.H-(parent.NF-i)*18; parent.object[i].move(); } } } } } this.frm = document.getElementById(oCont); this.H = parseInt(this.frm.style.height); this.frm = this.frm.getElementsByTagName("span"); this.NF = this.frm.length; for(i=0;i<this.NF;i++) this.object[i] = new this.CObj(this, i); this.object[0].obj.onmouseover(); this.S = 10; } onload = function() { object[0] = new Slide(0, "frames"); } //--> </script></head><body> <div style="position: absolute; left: 50%; top: 50%;"> <div id="frames" style="overflow: hidden; position: absolute; width: 200px; height: 340px; left: -100px; top: -170px;"> <span style="top: 0pt; height: 211px; visibility: visible;" class="link"><div class="title_o"></div> <div style="margin: 20px; overflow: hidden; position: relative; text-align: center; font-family: verdana; font-size: 32px; font-weight: bold; color: rgb(255, 255, 255); height: 90%; visibility: visible;"> The Circle of Life </div> </span> <span style="top: 213px; height: 211px; visibility: visible;" class="link"><div class="title">Programmer to Module Leader:</div> <div style="visibility: hidden;" class="text"> "This is not possible. **Impossible**. It will involve design change and no body in our team knows the design of the system. And above that nobody in our company knows the language in which this software has been written. So even if somebody wants to work on it, they can't. If you ask my personal opinion the company should never take these type of projects." </div> </span> <span style="top: 231px; height: 211px; visibility: visible;" class="link"><div class="title">Module Leader to Project Manager:</div> <div style="visibility: hidden;" class="text"> "This project will involve design change. Currently we don't have people who have experience in this type of work. Also the language is unknown so we will have to arrange for some training if we take this project. In my personal opinion, we should avoid taking this project." </div> </span> <span style="top: 249px; height: 211px; visibility: visible;" class="link"><div class="title">Project Manager to 1st Level Manager:</div> <div style="visibility: hidden;" class="text"> "This project involves design change in the system and we don't have much experience in that area. Also not many people are trained in this area. In my personal opinion we can take the project but we should ask for some more time." </div> </span> <span style="top: 267px; height: 211px; visibility: visible;" class="link"><div class="title">1st Level Manager to 2nd Level Manager:</div> <div style="visibility: hidden;" class="text"> "This project involves design re-engineering. We have some people who have worked in this area and some who know the language. So they can train other people. In my personal opinion we should take this project but with caution." </div> </span> <span style="top: 285px; height: 211px; visibility: visible;" class="link"><div class="title">2nd Level Manager to CEO:</div> <div style="visibility: hidden;" class="text"> "This project will show the industry our capabilities in remodeling the design of a complete system. We have all the necessary skills and people to execute this project successfully. Some people have already given in-house training in this area to other people. In my personal opinion we should not let this project go by under any circumstance." </div> </span> <span style="top: 303px; height: 211px; visibility: visible;" class="link"><div class="title">CEO to Client:</div> <div style="visibility: hidden;" class="text"> "These are the type of projects in which our company specialize. We have executed many project of the same nature for many big clients. Trust me when I say that you are in the safest hand in the Industry. In my personal opinion we can execute this project successfully and that too well with in the given time frame." </div> </span> <span style="top: 321px; height: 211px; visibility: visible;" class="link"><div class="title"></div> <div style="margin: 20px; overflow: hidden; position: relative; text-align: center; font-family: verdana; font-size: 32px; font-weight: bold; color: rgb(255, 255, 255); height: 90%; visibility: hidden;"> The End </div> </span> </div> </div> </body></html>