이전
목록
다음
E

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

Elbis
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 2006-05-11 (목) 11:05:36 · 2905
<!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,725
10-09-19 조회 2,762
10-09-15 조회 2,759
10-09-15 조회 4,166
10-09-15 조회 3,385
10-09-15 조회 2,495
10-09-07 조회 3,606
10-08-27 조회 4,071
10-06-11 조회 4,243
10-05-31 조회 2,493
10-02-27 조회 5,006
10-02-09 조회 3,754
09-10-10 조회 7,345
09-03-19 조회 3,204
09-02-09 조회 3,469
09-02-09 조회 4,533
08-11-01 조회 2,913
08-09-29 조회 4,565
08-09-26 조회 3,513
08-09-26 조회 3,589
08-09-26 조회 2,725
08-09-26 조회 3,769
08-09-26 조회 3,496
08-09-26 조회 4,261
08-09-18 조회 3,582
08-09-09 조회 3,235
08-08-28 조회 2,775
08-07-06 조회 3,546
08-05-21 조회 4,710
08-05-13 조회 4,543
08-04-17 조회 4,923
08-02-19 조회 3,544
08-01-18 조회 3,845
08-01-10 조회 3,822
07-10-22 조회 3,656
07-10-09 조회 4,311
07-10-03 조회 3,516
07-07-06 조회 4,214
07-07-06 조회 4,427
07-07-06 조회 4,037
07-06-28 조회 3,568
07-06-05 조회 3,574
07-06-05 조회 4,121
07-05-30 조회 3,292
07-05-02 조회 3,688
07-04-15 조회 5,149
07-04-11 조회 3,631
07-04-05 조회 3,931
07-03-31 조회 3,149
07-03-31 조회 4,124
07-03-30 조회 3,735
07-03-24 조회 4,006
07-03-22 조회 3,659
07-03-12 조회 4,414
07-02-16 조회 3,275
07-02-14 조회 5,168
07-02-10 조회 3,998
07-02-09 조회 4,388
07-01-19 조회 4,049
07-01-16 조회 4,978
06-12-16 조회 5,840
06-11-30 조회 3,602
06-11-25 조회 3,710
06-10-15 조회 5,073
06-09-26 조회 5,310
06-09-26 조회 5,427
06-09-22 조회 4,277
06-09-21 조회 3,546
06-09-21 조회 3,643
06-09-02 조회 3,486
06-08-08 조회 5,117
06-07-20 조회 3,728
06-07-17 조회 3,361
06-07-13 조회 4,182
06-07-11 조회 3,483
06-07-11 조회 3,486
06-07-11 조회 3,845
06-06-29 조회 6,070
06-06-19 조회 6,465
06-06-02 조회 3,516
06-05-24 조회 5,001
06-05-14 조회 7,780
06-05-08 조회 3,901
06-02-02 조회 5,464
05-12-16 조회 4,516
05-12-05 조회 5,165
05-06-28 조회 4,118
05-04-11 조회 4,069
05-04-11 조회 4,255
05-04-11 조회 3,318
05-03-13 조회 3,222
05-03-12 조회 4,299
04-12-08 조회 7,781
04-12-01 조회 5,186
04-11-28 조회 3,368
04-11-28 조회 3,210
04-08-05 조회 5,622
04-08-05 조회 4,975
04-08-05 조회 5,584
글쓰기