타 사이트에서 이 프로그램을 분석해봤습니다! 상대방 홈페이지가 프레임을 사용하고 마우스 우클릭 기능이 해제되어 있어서 시간이 오래 걸렸어요!
이 페이지를 탐색할 때 툴바는 항상 왼쪽 상단에 떠 있습니다. 마음에 들지 않으면 위치를 직접 조정할 수 있습니다! 이 코드를 여러 페이지에서 사용하려면 jsp 프로그램 부분을 JS 파일에 작성한 다음 이를 호출하여 구현하면 됩니다.
데모 주소: http://www.85time.com/softuse/bar.htm
<br> <META http-equiv="Content-Type" content="text/html; charset=gb2312"> <br><STYLE type="text/CSS"> <br>.wdBlack{ 글꼴 크기: 9pt; 글꼴 계열:宋体; 색상:검정색 } <br>.wdGray{ 글꼴 크기:9pt; 글꼴 계열:宋体 } <br> .wdBlue{ 글꼴 크기:9pt; 선 높이:11pt; 색상:#2F8BDF } <br>.wdRed{ 글꼴 크기:9pt; 글꼴 계열:宋体; 색상:빨간색 } <br>.wdWhite{ 글꼴 크기:9pt; 줄 높이:11pt; 글꼴 계열:宋体; 색상:흰색 } <br>.moveme{cursor: move;} <br>.handle{cursor : 이동;} <br>.coolBar{배경: #fffffc;border-top: 1px 단색 버튼 강조; 테두리-하단: 1px 단색 버튼 그림자; ; 글꼴: 메뉴;} <br>.coolButton{font-size:9pt;border: 1px solid 버튼면; text-align: center; 커서: hand;color:#555555} <br>.coolButton IMG 필터: 회색();} div{ 글꼴 크기:9pt; 글꼴 계열:宋体; 색상: 검정 } <br>텍스트{ 글꼴 크기:9pt; 글꼴- family:宋体; color:black } <br>INPUT{ 글꼴 크기:9pt; line-height:11pt; color:black } <br>table{ 글꼴 크기:9pt; 11pt; 글꼴 계열:宋体; 색상:검정색 } <br>본체{ 글꼴 크기:9pt; 글꼴 계열:宋体; 색상:검정색 } <br>양식{ 글꼴 크기:9pt; line-height:11pt; 글꼴-가족:宋体; 색상:검정색 } <br><br>A:link{ 글꼴-가족:宋体; 텍스트 장식: 없음; 🎜>A:visited{ 글꼴-크기:宋体; 텍스트 장식: 없음; 색상:#2F8BDF } <br>A:hover{ 글꼴-크기:9pt; 장식: 밑줄; #FF0000 } <br><br><script 언어="javascript"> var dragobject = null <br> var ty; <br>document.onmouseout = doOut; <br>document.onmouseup = doUp; >document.onmouseup=initUp; <br>document.onmousemove=initMove; <br>function stat(){ <br>var a = pageYOffset; <br>setTimeout('stat) ()',2); <br>} <br>함수 수정(){ <br>nome=navigator.appName <br>if(nome=='Netscape') <br>else{ <br>var a=document.body.scrollTop; <br>var b=document.body.scrollLeft; <br>bar.style.top = a; <br>bar.style.left = b; >} <br>function getReal(el) { <br>temp = el; <br>while ((temp != null) && (temp.tagName != "BODY")) { <br>if ((temp. className == "moveme") || (temp.className == "handle")){ <br>el = temp; <br>return el; <br>} <br>temp.parentElement; } <br>el 반환 <br>} <br>function moveme_onmousedown() { <br>el = getReal(window.event.srcElement) <br>if (el.className == "moveme") { <br> dragobject = el; <br>ty = (window.event.clientY - dragobject.style.pixelTop) <br>tx = (window.event.clientX - dragobject.style.pixelLeft) <br>window.event.returnValue = false; <br>window.event.cancelBubble = true; <br>}else if (el.className == "handle") { <br>tmp = el.getAttribute("for"); tmp != null) { <br>el = eval(tmp); <br>dragobject = el; <br>ty = (window.event.clientY - dragobject.style.pixelTop) <br>tx = (window. event.clientX - dragobject.style.pixelLeft); <br>window.event.returnValue = false; <br>window.event.cancelBubble = <br>} else { <br>dragobject = null; <br>}else { <br>dragobject = null; <br>} <br>} <br>function moveme_onmouseup() { <br>if(dragobject) { <br>dragobject = null; >} <br>function moveme_onmousemove() { <br>if (dragobject) { <br>if(window.event.clientX >= 0) { <br>dragobject.style.left = window.event.clientX - tx ; <br>dragobject.style.top = window.event.clientY - 타이; <br>} <br>window.event.returnValue = false; <br>window.event.cancelBubble = true; <br>} <br>} <br>if (document.all) { <br>document.onmousedown = moveme_onmousedown; <br>document.onmouseup = moveme_onmouseup; <br>document.onmousemove = moveme_onmousemove; <br>} <br>function doOver() { <br>var toEl = getReal(window.event.toElement, "className", "coolButton"); <br>var fromEl = getReal(window.event.fromElement, "className", "coolButton"); <br>if (toEl == fromEl) return; <br>var el = toEl; <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>if (el.className == "coolButton") <br>el.onselectstart = new Function("return false"); <br>if ((el.className == "coolButton") && !cDisabled) { <br>makeRaised(el); <br>makeGray(el,false); <br>} <br>} <br>function doOut() { <br>var toEl = getReal(window.event.toElement, "className", "coolButton"); <br>var fromEl = getReal(window.event.fromElement, "className", "coolButton"); <br>if (toEl == fromEl) return; <br>var el = fromEl; <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>var cToggle = el.cToggle; <br>toggle_disabled = (cToggle != null); <br>if (cToggle && el.value) { <br>makePRessed(el); <br>makeGray(el,true); <br>} <br>else if ((el.className == "coolButton") && !cDisabled) { <br>makeFlat(el); <br>makeGray(el,true); <br>} <br>} <br>function doDown() { <br>el = getReal(window.event.srcElement, "className", "coolButton"); <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>if ((el.className == "coolButton") && !cDisabled) { <br>makePressed(el) <br>} <br>} <br>function doUp() { <br>el = getReal( window.event.srcElement, "className", "coolButton"); <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>if ((el.className == "coolButton") && !cDisabled) { <br>makeRaised(el); <br>} <br>} <br>function getReal(el, type, value) { <br>temp = el; <br>while ((temp != null) && (temp.tagName != "BODY")) { <br>if (eval("temp." + type) == value) { <br>el = temp; <br>엘을 반환; <br>} <br>temp = temp.parentElement; <br>} <br>el을 반환합니다. <br>} <br>function findChildren(el, type, value) { <br>var children = el.children; <br>var tmp = new Array(); <br>var j=0; <br>for (var i=0; i<children.length; i++) { <br/>if (eval("children[i]." + type + "=="" + value + """)) { <br/>tmp[tmp.length] = 어린이[i]; <br/>} <br/>tmp = tmp.concat(findChildren(children[i], 유형, 값)); <br/>} <br/>tmp를 반환합니다. <br/>} <br/>함수 비활성화(el) { <br/>if (document.readyState != "complete") { <br/>window.setTimeout("disable(" + el.id + ")", 100) ; <br/>반환; <br/>} <br/>var cDisabled = el.cDisabled; <br/>cDisabled = (cDisabled != null); <br/>if (!cDisabled) { <br/>el.cDisabled = true; <br/>el.innerHTML = '<span style="배경: 버튼섀도; 너비: 100%; 높이: 100%; 텍스트 정렬: center;border:1px">' + <br>'<span style="filter:Mask(Color=buttonface) DropShadow(Color=buttonhighlight, OffX=1, OffY=1, Positive=0); 높이: 100%; 너비: 100%%; 텍스트 -정렬: 중앙;경계:1px">' + <br>el.innerHTML + <br>'</span>' + <br>'</span>'; <br>if (el.onclick != null) { <br>el.cDisabled_onclick = el.onclick; <br>el.onclick = null; <br>} <br>} <br>} <br>기능 활성화(el) { <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>if (cDisabled) { <br>el.cDisabled = null; <br>el.innerHTML = el.children[0].children[0].innerHTML; <br>if (el.cDisabled_onclick != null) { <br>el.onclick = el.cDisabled_onclick; <br>el.cDisabled_onclick = null; <br>} <br>} <br>} <br>function addToggle(el) { <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>var cToggle = el.cToggle; <br>cToggle = (cToggle != null); <br>if (!cToggle && !cDisabled) { <br>el.cToggle = true; <br>if (el.value == null) <br>el.value = 0; <br>if (el.onclick != null) <br>el.cToggle_onclick = el.onclick; <br>그밖에 <br>el.cToggle_onclick = ""; <br>el.onclick = new Function("toggle(" + el.id +"); " + el.id + ".cToggle_onclick();"); <br>} <br>} <br>function RemoveToggle(el) { <br>var cDisabled = el.cDisabled; <br>cDisabled = (cDisabled != null); <br>var cToggle = el.cToggle; <br>cToggle = (cToggle != null); <br>if (cToggle && !cDisabled) { <br>el.cToggle = null; <br>if (el.value) { <br>toggle(el); <br>} <br>makeFlat(el); <br>if (el.cToggle_onclick != null) { <br>el.onclick = el.cToggle_onclick; <br>el.cToggle_onclick = null; <br>} <br>} <br>} <br>함수 전환(el) { <br>el.value = !el.value; <br>if (el.value) <br>el.style.Background = "URL()"; <br>그 외 <br>el.style.BackgroundImage = ""; <br>} <br>function makeFlat(el) { <br>with (el.style) { <br> background = ""; <br>border = "1px 솔리드 버튼페이스"; <br>패딩 = "1px"; <br>} <br>} <br>function makeRaised(el) { <br>with (el.style) { <br>borderLeft = "1px solid #2F8BDF"; <br>borderRight = "1px 솔리드 #2F8BDF"; <br>borderTop = "1px 솔리드 #2F8BDF"; <br>borderBottom = "1px 솔리드 #2F8BDF"; <br>패딩 = "1px"; <br>} <br>} <br>function makePressed(el) { <br>with (el.style) { <br>borderLeft = "1px solid Buttonhighlight"; <br>borderRight = "1px 솔리드 버튼섀도우"; <br>borderTop = "1px 단색 버튼 강조 표시"; <br>borderBottom = "1px 솔리드 버튼섀도우"; <br><br>paddingTop = "2px"; <br>paddingLeft = "2px"; <br>paddingBottom = "0px"; <br>paddingRight = "0px"; <br>} <br>} <br>function makeGray(el,b) { <br>var filtval; <br>if (b) <br>filtval = "회색()"; <br>else <br>filtval = ""; <br>var imgs = findChildren(el, "tagName", "IMG"); <br>for (var i=0; i<imgs.length; i++) { <br/>imgs[i].style.filter = filtval; <br/>} <br/>} <br/>함수 로드(ws) { <br/>parent.location.href=ws; <br/>} <br/>function initDown() { <br/>doDown(); <br/>moveme_onmousedown(); <br/>} <br/>function initUp() { <br/>doUp(); <br/>moveme_onmouseup(); <br/>} <br/>function initMove() { <br/>moveme_onmousemove(); <br/>} <br/></script> <br></HEAD> <br><BODY onLoad='fix()' onScroll="fix()" onResize="fix()"> <br><span id="bar" style="position:absolute;left:0px;top:0px;width:500px; height:1px; z-index:9"> <br><테이블 클래스=coolBar id=toolbar1 너비=100%> <br><tr> <br><td class=coolButton onclick="Javascript:self.location='http://www.85time.com/85time/'">网友论坛</td> <br><td class=coolButton onclick="javascript:self.location='http://www.85time.com/engine.htm'">实用引擎</td> <br><td class=coolButton onclick="javascript:self.location='http://www.85time.com/opus/opus.htm'">推荐작품</td> <br><td class=coolButton onclick="javascript:self.location='http://www.85time.com/gb/'">留言板</td> <br><td class=coolButton onclick="javascript:self.location='http://www.85time.com/chat/'">聊天室</td> <br></tr> <br></테이블> <br></span> <br></body> <br></html> 