테스트 사이트 - 개발 중인 베타 버전입니다

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

<!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>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
12452
40
25015
12447
12446
12445
JavaScript PLSQL이란
29296
12440
기타 메뉴 4
12438
12437
29294
35
32
12434
12433
12432
29293
29
12431
12428
12421
29292
12411
12402
27
29290
12400
24
12397
12396
21
12391
12390
18
16
12377
12373
13
9
12372
12371
12363
1
13432
12362
12360
12355
25014
29287
12352
12349
29279
12344
12340
12335
12333
12331
29273
12330
12329
12328
12324
12323
12318
12316
12313
12310
12309
12307
12303
12296
12291
12280
12277
12275
29272
12274
12260
12252
12250
12248
29267
12245
29266
29261
12239
12238
29251
12236
12231
12228
12214
12211
12210
29248
29247
25010
12208
12207
12202