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

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

· 19년 전 · 1871
<!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>

댓글 작성

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

로그인하기

게시글 목록

번호 제목
11111
11108
11107
11105
11101
11099
11095
11093
24843
11065
11063
11059
29001
11054
28999
11050
28998
28956
11044
11023
11004
28946
10993
10990
28903
10984
24842
28900
10982
10978
28899
10974
10970
24831
24830
10967
10965
10963
10956
10954
10950
10946
24818
10943
28885
24813
10940
10927
10925
10920
10916
10914
10913
10908
10905
10904
10899
24803
28882
10898
28878
28877
24802
24801
24800
24799
10893
10892
24797
24794
10891
28871
28870
10881
10872
10870
28868
10868
10866
28862
10864
28861
10863
28860
10862
28859
28858
10861
10859
28856
10857
28854
10856
28853
28852
28851
10855
28850
10854
28849