이전
목록
다음
E

숨어있는 레이어에 마우스를 대면 외부문서를 슬라이딩 해 불러옵니다

Elbis
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 · 2006-05-11 (목) 11:05:36 · 2926
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="expires" content="-1">
<meta http-equiv="pragma" content="no-cache">
<title> jasko sample script </title>
</head>

<!---- [1단계] 아래 코드를 <HEAD> 와 <HEAD> 태그 사이에 붙여 넣으세요 --->

<style>
<!--
/* 메뉴판의 모양을 설정 하세요 */

#jslidemenubar, #jslidemenubar2{
cursor:hand;/* 메뉴판에 마우스를 대었을때의 커서 모양 */
position:absolute;
left:-155px;
width:160px;/* 메뉴판의 크기 */
top:50px;/* 위에서 부터의 간격 */
border:1.5px solid green;/* 테두리 모양 */
background-color:lightgreen;/* 배경색 */
layer-background-color:lightgreen;/* NS 용 배경색 */
font:12px 굴림;/* 메뉴 글꼴 */
line-height:20px;/* 라인 간격 */
}
-->
</style>


<!---- [2단계] 아래의 방법으로 <BODY> 와 <BODY> 태그 사이에 붙여 넣으세요 --->

<iframe id="jslidemenubar2" style="left:-150;border-width:0" src="sample.html" width=200 height=270></iframe>
<layer id="jslidemenubar" onMouseover="pull()" onMouseout="draw()" src="sample.html"></layer>

<script language="JavaScript1.2">

var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0

function regenerate(){
window.location.reload()
}
function regenerate2(){
if (ns4)
setTimeout("window.onresize=regenerate",400)
}
window.onload=regenerate2
if (ie4||ns6){
themenu=(ns6)? document.getElementById("jslidemenubar2").style : document.all.jslidemenubar2.style
rightboundary=0
leftboundary=-150
}
else{
themenu=document.layers.jslidemenubar
rightboundary=150
leftboundary=10
}
function pull(){
if (window.drawit)
clearInterval(drawit)
pullit=setInterval("pullengine()",50)
}
function draw(){
clearInterval(pullit)
drawit=setInterval("drawengine()",50)
}
function pullengine(){
if (ie4&&themenu.pixelLeft<rightboundary)
themenu.pixelLeft+=5
else if (ns6&&parseInt(themenu.left)<rightboundary)
themenu.left=parseInt(themenu.left)+5
else if(ns4&&themenu.left<rightboundary)
themenu.left+=5
else if (window.pullit)
clearInterval(pullit)
}
function drawengine(){
if (ie4&&themenu.pixelLeft>leftboundary)
themenu.pixelLeft-=5
else if (ns6&&parseInt(themenu.left)>leftboundary)
themenu.left=parseInt(themenu.left)-5
else if(ns4&&themenu.left>leftboundary)
themenu.left-=5
else if (window.drawit)
clearInterval(drawit)
}
</script>

<!------------------------- 여기까지 ------------------------------------>

</body>
</html>

<!--- [3단계] iframe 에서 불러올 sample.html 파일에 아래의 코드를 입력 하세요 --->

<!--------

<body onMouseover="if (document.all&&window.parent.pull) window.parent.pull()"
onMouseout="if (document.all&&window.parent.pull) window.parent.draw()" topmargin="5" leftmargin="5"
marginwidth="5" marginheight="5">

-------><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
#개발자팁 #개발자 #팁자료실 #기타
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
10-09-25 조회 2,739
10-09-19 조회 2,775
10-09-15 조회 2,774
10-09-15 조회 4,179
10-09-15 조회 3,409
10-09-15 조회 2,515
10-09-07 조회 3,629
10-08-27 조회 4,082
10-06-11 조회 4,264
10-05-31 조회 2,507
10-02-27 조회 5,024
10-02-09 조회 3,773
09-10-10 조회 7,360
09-03-19 조회 3,223
09-02-09 조회 3,494
09-02-09 조회 4,548
08-11-01 조회 2,931
08-09-29 조회 4,580
08-09-26 조회 3,526
08-09-26 조회 3,601
08-09-26 조회 2,735
08-09-26 조회 3,780
08-09-26 조회 3,506
08-09-26 조회 4,272
08-09-18 조회 3,604
08-09-09 조회 3,247
08-08-28 조회 2,787
08-07-06 조회 3,558
08-05-21 조회 4,722
08-05-13 조회 4,558
08-04-17 조회 4,936
08-02-19 조회 3,552
08-01-18 조회 3,863
08-01-10 조회 3,836
07-10-22 조회 3,667
07-10-09 조회 4,322
07-10-03 조회 3,530
07-07-06 조회 4,227
07-07-06 조회 4,440
07-07-06 조회 4,053
07-06-28 조회 3,590
07-06-05 조회 3,594
07-06-05 조회 4,138
07-05-30 조회 3,307
07-05-02 조회 3,694
07-04-15 조회 5,171
07-04-11 조회 3,646
07-04-05 조회 3,948
07-03-31 조회 3,166
07-03-31 조회 4,144
07-03-30 조회 3,756
07-03-24 조회 4,014
07-03-22 조회 3,674
07-03-12 조회 4,424
07-02-16 조회 3,288
07-02-14 조회 5,179
07-02-10 조회 4,012
07-02-09 조회 4,401
07-01-19 조회 4,062
07-01-16 조회 4,992
06-12-16 조회 5,858
06-11-30 조회 3,615
06-11-25 조회 3,723
06-10-15 조회 5,083
06-09-26 조회 5,328
06-09-26 조회 5,439
06-09-22 조회 4,294
06-09-21 조회 3,559
06-09-21 조회 3,657
06-09-02 조회 3,500
06-08-08 조회 5,131
06-07-20 조회 3,748
06-07-17 조회 3,375
06-07-13 조회 4,200
06-07-11 조회 3,493
06-07-11 조회 3,499
06-07-11 조회 3,865
06-06-29 조회 6,083
06-06-19 조회 6,478
06-06-02 조회 3,527
06-05-24 조회 5,012
06-05-14 조회 7,801
06-05-08 조회 3,918
06-02-02 조회 5,474
05-12-16 조회 4,529
05-12-05 조회 5,178
05-06-28 조회 4,135
05-04-11 조회 4,086
05-04-11 조회 4,266
05-04-11 조회 3,336
05-03-13 조회 3,238
05-03-12 조회 4,312
04-12-08 조회 7,795
04-12-01 조회 5,210
04-11-28 조회 3,382
04-11-28 조회 3,225
04-08-05 조회 5,641
04-08-05 조회 4,987
04-08-05 조회 5,599
글쓰기