| 메뉴를 클릭하면 서서히 나타납니다. ① <head>와 </head>부분에 넣어줍니다. ***************************************** <script language="JavaScript"> <!--// var x =0 var y=0 drag = 0 move = 0 window.document.onmousemove = mouseMove window.document.onmousedown = mouseDown window.document.onmouseup = mouseUp window.document.ondragstart = mouseStop function mouseUp() { move = 0 } function mouseDown() { if (drag) { clickleft = window.event.x - parseInt(dragObj.style.left) clicktop = window.event.y - parseInt(dragObj.style.top) dragObj.style.zIndex += 1 move = 1 } } function mouseMove() { if (move) { dragObj.style.left = window.event.x - clickleft dragObj.style.top = window.event.y - clicktop } } function mouseStop() { window.event.returnValue = false } function Show(divid) { divid.filters.blendTrans.apply(); divid.style.visibility = "visible"; divid.filters.blendTrans.play(); } function Hide(divid) { divid.filters.blendTrans.apply(); divid.style.visibility = "hidden"; divid.filters.blendTrans.play(); } //--> </script> ② <body>와 </body>부분에 넣어줍니다. ***************************************** 레이어를 만듭니다. <div id="layer1" style="position:absolute; left:181px; top:45px; width:101px; height:87px; z-index:1; visibility:hidden;filter:revealTrans(transition=23,duration=0.7) blendTrans(duration=0.7);" onmouseover="dragObj=sub1; drag=0;move=0" onmouseout="drag=0"> <p>스르륵~ 나타납니다.</p></div> ③ 옵션 ***************************************** div id="layer1" //레이어를 여러개 만들때 정해줄 이름 left:181px; top:45px; // 좌표 0,0을 기준으로 얼마의 거리를 띄울것인가? width:101px; height:87px; //레이어릐 가로 세로 크기 onmouseover="dragObj=sub1; drag=0;move=0" //drag의 값을 1로 하면 창을 움직일수 있습니다. ④ 링크부분에 넣어줍니다. ***************************************** <a href="javascript:void(Show(layer1))">열기</a> <a href="javascript:void(Hide(layer1))">닫기</a> |
카테고리 없음