1차 메뉴에 마우스 대면 2차 메뉴 펴지고 떼면 사라지는 태그
오래전부터 마우스 갖다 대면 2차 메뉴가 쫙 펴지거나 주르르 내려가고 마우스 떼면 사라지는 태그를 염원했습니다.
그러던 중 며칠 전에 네이버인가 다음의 어느 곳에서 그 실마리를 찾았는데 제 홈피 고치려는데 집중한 나머지 그 출처를 까먹고 말았습니다.
하여튼 거기서 봤던 정보를 거울삼아 제 홈피의 일부도 수정해 보았습니다.
지금 소개하려는 일부를 뺀 나머지 사이트가 그렇듯이 본래는 마우스 누르면 2차 메뉴가 아래로 떨어지는 것이기에 이도 당분간 시험해 보고서 '계속 사용'이나 나머지 사이트로의 확장 여부를 결정할 생각입니다.
옛말에 '백번을 들은 것이 단 한 번 보는 것만 못하다(백문이 불여일견). 라고 했거늘 소개할게요.
동영상으로 떠봤는데 대충 이런 모양새이고 맨 아래쪽은 실제 모델 사이트로 가는 링크입니다.
태그는 대충 이런 식으로 짜졌습니다.
<상략>
<가운데 부분도 핵심만 남기고 모두 잘라냈습니다.>
<BODY>
<DIV align=center style=margin:0>
<TABLE border=0 cellspacing=0 cellpadding=3 width='800'>
<TR>
<TD width='70' onMouseOver="document.getElementById('one').style.display='block';">홈피나라
<DIV id=one" style="z-index:5;width:250pt;;background-color:#C0C0FF;DISPLAY:none;position:absolute;left:200;top:7;padding:10 0 7 0;" onMouseOver="this.style.display='block';" onMouseOut="this.style.display='none';">
<SPAN onClick=window.open('http://My-ID.hosting.paran.com/','_blank')>파란</SPAN>
<SPAN onClick=window.open('http://My-ID.oranc.co.kr/','_blank')>오란씨</SPAN>
<SPAN onClick=window.open('http://My-ID.sosiz.com/index.htm','_blank')>소시지</SPAN>
<SPAN onClick=window.open('http://My-ID.365managed.net/','_blank')>365</SPAN>
<BR>
<SPAN onClick=window.open('http://My-ID.com.ne.kr/index.htm','_blank')>컴내꺼</SPAN>
<SPAN onClick=window.open('http://blog.hani.co.kr/My-ID/','_blank')>한겨레</SPAN>
<SPAN onClick=window.open('http://blog.dreamwiz.com/My-ID','_blank')>드림위즈</SPAN>
<SPAN onClick=window.open('http://My-ID.blog.me/','_blank')>네이버</SPAN>
<SPAN onClick=window.open('http://blog.daum.net/My-ID/','_blank')>다음</SPAN>
</DIV></TD>
<TD width='70' onMouseOver="document.getElementById('Two').style.display='block';">아랫마을
<DIV id="Two" style="z-index:5;width:250pt;background-color:#C0C0FF;DISPLAY:none;position:absolute;right:200;top:15;padding:10 0 7 0;" onMouseOver="this.style.display='block';" onMouseOut="this.style.display='none';">
<SPAN onClick=window.open('./Spelling.htm','SG')>한글@</SPAN>
<SPAN onClick=window.open('./Dic.htm','SG')>달력@</SPAN>
<SPAN onClick=window.open('./EmBlog.htm','SG')>계산@</SPAN>
<SPAN onClick=window.open('./Bus.htm','SG')>교통로</SPAN>
<SPAN onClick=window.open('./SGJ.htm','SG')>솔방울</SPAN>
</DIV>
</TD></TR>
</TABLE></DIV>
</BODY>
※ 참고로 위 태그에 들어간 사이트 주소 끝 부분에 붙은 글자 중 '_blank'는 다른 창에 열라는 태그이고, 'SG'는 해당 사이트 내부에 있는 index.htm(l)에서 지정한 페이지 이름입니다.
<하략>
두 개의 모델입니다.
사이트 상단이 그렇게 짜였거든요.
눌러서 확인해 보시면 더 수월할지도 모르겠네요.
물론 필요에 따라 수시로 바뀌니까 나중엔 전혀 다른 엉뚱한 모양새와 만날지도 모르겠지만, 그냥 홈피를 짤 때 필요한 태그로 참고 정도였으면 합니다.
못생긴 모델 하나 파란
못생긴 모델 둘 → 오란씨
'내 마음 오로지' 카테고리의 다른 글
| 위로받겠다는 생각 (0) | 2012.03.27 |
|---|---|
| 내 사람을 정하는 기준 (0) | 2012.03.26 |
| 압축프로그램 WinRar 4.11 버전 즐겁게 쓰기 (0) | 2012.03.26 |
| 살다 보면 하는 것마다 꼬이는 걸 경험들 하고 그러지요? (0) | 2012.03.24 |
| 마우스보다 빠르게! 윈도 단축키 쓰기 (0) | 2012.03.22 |
