|
예제보기
// 레이어의 위치등을 조절하셔서 쓰시면 되겠습니다
// 레이어는 더 추가하셔도 되며 스타일을 입혀도 되겠죠
<script language=javascript>
function showLayer(layerID) {
document.all[layerID].style.visibility = "visible";
}
function hideLayer(layerID) {
document.all[layerID].style.visibility = "hidden";
}
</script>
<div id="menu1" style=" position:absolute; left:10; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu1');" onmouseover="javascript:showLayer('menu1');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu2" style=" position:absolute; left:50; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu2');" onmouseover="javascript:showLayer('menu2');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu3" style=" position:absolute; left:100; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu3');" onmouseover="javascript:showLayer('menu3');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu4" style=" position:absolute; left:150; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu4');" onmouseover="javascript:showLayer('menu4');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu5" style=" position:absolute; left:200; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu5');" onmouseover="javascript:showLayer('menu5');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu6" style=" position:absolute; left:250; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu6');" onmouseover="javascript:showLayer('menu6');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<a href onmouseout="javascript:hideLayer('menu1');" onmouseover="javascript:showLayer('menu1');">메뉴1</a>
<a href onmouseout="javascript:hideLayer('menu2');" onmouseover="javascript:showLayer('menu2');">메뉴2</a>
<a href onmouseout="javascript:hideLayer('menu3');" onmouseover="javascript:showLayer('menu3');">메뉴3</a>
<a href onmouseout="javascript:hideLayer('menu4');" onmouseover="javascript:showLayer('menu4');">메뉴4</a>
<a href onmouseout="javascript:hideLayer('menu5');" onmouseover="javascript:showLayer('menu5');">메뉴5</a>
function showLayer(layerID) {
document.all[layerID].style.visibility = "visible";
}
function hideLayer(layerID) {
document.all[layerID].style.visibility = "hidden";
}
</script>
<div id="menu1" style=" position:absolute; left:10; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu1');" onmouseover="javascript:showLayer('menu1');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu2" style=" position:absolute; left:50; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu2');" onmouseover="javascript:showLayer('menu2');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu3" style=" position:absolute; left:100; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu3');" onmouseover="javascript:showLayer('menu3');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu4" style=" position:absolute; left:150; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu4');" onmouseover="javascript:showLayer('menu4');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu5" style=" position:absolute; left:200; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu5');" onmouseover="javascript:showLayer('menu5');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<div id="menu6" style=" position:absolute; left:250; top:30px; visibility : hidden">
<table border=1 onmouseout="javascript:hideLayer('menu6');" onmouseover="javascript:showLayer('menu6');">
<tr>
<td bgcolor=white>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
<a href="http://cdmanii.tistory.com" target="new">내블로그 가기<br>
</td>
</tr>
</table>
</div>
<a href onmouseout="javascript:hideLayer('menu1');" onmouseover="javascript:showLayer('menu1');">메뉴1</a>
<a href onmouseout="javascript:hideLayer('menu2');" onmouseover="javascript:showLayer('menu2');">메뉴2</a>
<a href onmouseout="javascript:hideLayer('menu3');" onmouseover="javascript:showLayer('menu3');">메뉴3</a>
<a href onmouseout="javascript:hideLayer('menu4');" onmouseover="javascript:showLayer('menu4');">메뉴4</a>
<a href onmouseout="javascript:hideLayer('menu5');" onmouseover="javascript:showLayer('menu5');">메뉴5</a>
|
'소프트웨어 > ASP / JS / CSS / C#' 카테고리의 다른 글
Jscript mdb 직접 연결하여 연동하기 (1) | 2008.08.15 |
---|---|
절대 , 상대 레이어 지정하기 (2) | 2008.08.01 |
마우스 올리면 레이어 보이도록 메뉴만들기 (6) | 2008.07.09 |
img 태그 대체 그림 뛰우기 (4) | 2008.05.19 |
CSS 사전 ,도움말 (12) | 2008.02.27 |
파일 최근 수정일 확인하는 스크립트 (1) | 2008.01.29 |
한때 홈페이지 만든다고 나모5버전으로 살짝 만들었던 기억이 나는군요..ㅎㅎ
그렇군요 ^^;
저도 살짝 기억이 ㅋㅋ
http://cdmanii.com/433
메뉴바를 만들려고 하는데요
마우스를 올리면 내블러그가 text로 보이는데..
그 text를 클릭 할수 있는 소스는 뭔가요..?
마이스를 움직이면.. 사라집니다. ㅜㅠ
A 지점에 마우스를 올리면 B 가 보이고 까지의 설명이 이것이구요.
마우스가 A를 벗어나면 B가 사라지겠죠.
그래서 마우스를 A에서 B로 옮겨갔을 때 B를 다시 보이게 하는 부분이 들어가야합니다. ^^
안녕하세요 번개입니다 IT블로그 만들고싶는데 ctrc0113@naver.com
ctrc0113@nate.com 이메일로보내주세용