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

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

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

댓글 작성

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

로그인하기

게시글 목록

번호 제목
2206
2202
18026
2201
2199
2194
2192
2187
12600
18019
18017
2186
18014
2175
2173
18010
2164
2157
2156
18008
18003
2154
2150
12588
2144