웹마스터 팁
레이어를 클릭해서 보이거나 사라지게 하기
2004.08.18 00:52
※ 레이어를 홈피에 적용시킬려고 공부하다가 알아낸 겁니다. ※
제로보드사이트에서 검색해서 공부중에 발견한 것이죠 ^^
그냥 응용한거라 보시면 될 듯 합니다.
☞ <head></head> 사이에 아래 스크립트를 넣으세요 ☜
<script language="javascript">
<!--
function show_hide_layer(lname)
{
if (lname.style.visibility == 'hidden') lname.style.visibility = 'visible';
else if (lname.style.visibility == 'visible') lname.style.visibility = 'hidden';
}
-->
</script>
☞ 제가 사용한 방법은 글씨를 클릭하면 원하는 레이어가 보이거나 사라지게 했습니다 ☜
☞ 아래는 본문에 들어간 부분 입니다. ☜
<font color="#66ccb8" size="2" style="line-height:-5pt;margin-left:10px;text-decoration:none;">
<b STYLE='CURSOR:HAND' OnClick="show_layer(document.getElementById('layer6'));" ONFOCUS='this.blur()' TITLE="NovaHero 음악 듣기~♬">
<strong>음악 듣기</strong>
</b></font>
<div id="layer6" style="position:absolute; left:0px; top:383px; z-index:1; visibility:hidden;">
<table background="./bg.gif" width="1014" height="30" leftmargin="0" topmargin="0" border="0" cellpadding="0" cellspacing="0">
<tr>
<TD height="30" width="1014">
레이어에 보일 것을 여기에 넣으세요. img, iframe, 글씨.... 등등....
</TD>
</tr>
</table>
☞ 저 처럼 모르셔서 공부하느라 시간 너무 뺏길 초보분들에게 도움이 되었으면 합니다 ☜
OnClick="show_layer(document.getElementById('layer6'));"
부분과
<div id="layer6" style="position:absolute; left:0px; top:383px; z-index:1; visibility:hidden;">
부분을 보시고 생각해보시면 어떻게 적용되는지 아실겁니다.
액션은 OnClick 말고 다른거 사용하는 방법도 있겠구요.
여러가지로 다양하게 원하시는대로 적용할 수 있습니다.
저역시 응용해서 올린거구요 ^^;
제로보드사이트에서 검색해서 공부중에 발견한 것이죠 ^^
그냥 응용한거라 보시면 될 듯 합니다.
☞ <head></head> 사이에 아래 스크립트를 넣으세요 ☜
<script language="javascript">
<!--
function show_hide_layer(lname)
{
if (lname.style.visibility == 'hidden') lname.style.visibility = 'visible';
else if (lname.style.visibility == 'visible') lname.style.visibility = 'hidden';
}
-->
</script>
☞ 제가 사용한 방법은 글씨를 클릭하면 원하는 레이어가 보이거나 사라지게 했습니다 ☜
☞ 아래는 본문에 들어간 부분 입니다. ☜
<font color="#66ccb8" size="2" style="line-height:-5pt;margin-left:10px;text-decoration:none;">
<b STYLE='CURSOR:HAND' OnClick="show_layer(document.getElementById('layer6'));" ONFOCUS='this.blur()' TITLE="NovaHero 음악 듣기~♬">
<strong>음악 듣기</strong>
</b></font>
<div id="layer6" style="position:absolute; left:0px; top:383px; z-index:1; visibility:hidden;">
<table background="./bg.gif" width="1014" height="30" leftmargin="0" topmargin="0" border="0" cellpadding="0" cellspacing="0">
<tr>
<TD height="30" width="1014">
레이어에 보일 것을 여기에 넣으세요. img, iframe, 글씨.... 등등....
</TD>
</tr>
</table>
☞ 저 처럼 모르셔서 공부하느라 시간 너무 뺏길 초보분들에게 도움이 되었으면 합니다 ☜
OnClick="show_layer(document.getElementById('layer6'));"
부분과
<div id="layer6" style="position:absolute; left:0px; top:383px; z-index:1; visibility:hidden;">
부분을 보시고 생각해보시면 어떻게 적용되는지 아실겁니다.
액션은 OnClick 말고 다른거 사용하는 방법도 있겠구요.
여러가지로 다양하게 원하시는대로 적용할 수 있습니다.
저역시 응용해서 올린거구요 ^^;
댓글 3
-
㉭ㅐ모
2004.08.20 14:49
홈페이지 방분하니 이상한 물건이 있던데요. PFVS 그걸 아직도 이용하시는 분이 계시다니요. 놀라울 따름입니다. 너무 대충 만든거라서 저도 거의 사용 않하는 상태 인데요. 오랜만에 보니 반갑네요. -
†천상의燦†
2004.08.21 21:43
^^ 제 홈페이지에서 그거 인기 좋습니다.
초등학생이 대부분입니다만... ^^ -
서준범
2007.02.10 12:09
사용하다보니 소스가 빠진게 있군요
OnClick="show_layer(document.getElementById('+ 'layer6'));"
를
OnClick="show_hide_layer(document.getElementById('layer6'));"
고쳐야 됩니다.
사용하시는 분들 주의하세요
| 제목 | 글쓴이 | 날짜 |
|---|---|---|
| [초보] 확장자 체크하는 매우 간단한 소스; [4] | 에지 | 2003.09.29 |
인터넷 사이트 , MS 오피스로 관리하기 3 공시사항 나타내기
[5]
 | 한꼬마 | 2003.09.24 |
| Whois를 이용해서 접속자가 사용하는 ISP출력(한국통신,하나로,두루넷 등등) [6] | 김재경 | 2003.09.23 |
| 달력 만들기 [10] | TheMics | 2003.09.23 |
| php+mysql>>공지사항|일기장 프로그램 1장:DB구조,schema 파일로 테이블생성하기! [2] | 시루바 | 2003.09.23 |
|
인터넷 사이트, MS 오피스로 관리하기 2 공지사항
[4]
| 한꼬마 | 2003.09.23 |
|
인터넷 사이트 , MS 오피스로 관리하기
[3]
| 한꼬마 | 2003.09.22 |
| 임시적으로 php.ini 환경변수들 대처하기 [2] | impre | 2003.09.20 |
| 동적으로 Extensions(library) 로딩하기 | impre | 2003.09.20 |
| include 할시에 주의사항..(경로설정관련) [10] | 피너츠 | 2003.09.14 |
| 지정한만큼 암호화/해독 하기 [24] | 뒹굴리스트 | 2003.09.10 |
| 모든파일을 리스트로 만들기; [10] | 플로렐라 | 2003.09.10 |
| 군대간 친구 남은날짜 구하기 2(복무기간 단축에 따른 수정) [8] | 신민경 | 2003.09.02 |
| 자료실에 쓸만한 자료용량 환산 [7] | 한승진 | 2003.09.01 |
| php 랜덤 이미지 디렉토리 검색으로 편하게.. [3] | 꺼노 | 2003.08.28 |
| 웹디자이너와 프로그래머가 사이 좋게 코딩하는 방법 [50] | 마이템플릿 | 2003.08.13 |
| 개판 오분전 정규식(1) | 미친개 | 2003.08.07 |
| 개판 오분전 정규식(2) [5] | 미친개 | 2003.08.07 |
| 개판 오분전 정규식(3) [2] | 미친개 | 2003.08.07 |
| 개판 오분전 정규식(4) | 미친개 | 2003.08.07 |