<!---- [1단계] 아래의 스타일시트를 HEAD 부분에 복사 해 넣으세요 ----->
1.<style> 2./*r공지창의 모양을 설정하는 곳입니다*/3.<!-- 4.body,td{font-size:12px} 5.#postit{position:absolute;width:250;padding:5px;background-color:lightyellow;border:1px solid black;visibility:hidden;z-index:100;cursor:hand;} 6.--> 7.</style></head>
<body>
<!---- [2단계] 아래와 같은 방법으로 태그와 코드를 복사 해 넣으세요 --->
01.<!--///////////////////////// 내용 입력 부분입니다 ///////////////////////////-->02.<div id="postit" style="left:150px;top:150px"> 03. <!------- 위에서 공지창의 위치를 설정 하세요 -------->04.<div align="right"><b><a href="javascript:closeit(">[닫기]</a></b></div> 05. 06.<b>포스트잇 스크립트</b><br> 07.<p>페이지를 열면 작은 공지창 처럼 뜨는 포스트잇 스크립트 입니다<br> 08.마우스로 원하는 위치에 끌어 놓을 수 있답니다</p> 09.<p>이 공지창은 브라우저를 열때마다 뜨게 할 수도 있고, 한번만 열리게 할 수도 있습니다</p> 10.<p>자바스크립트 소스뱅크 <a href="http://www.jasko.co.kr">자스코</a></p> 11.</div> 12. 13.<!--///////////////////////// 내용 입력 부분입니다 ///////////////////////////-->01.<script> 02. 03.// 브라우저세션당 한번씩만 열리게 하려면 1로, 매번 열리게 하려면 0 으로 설정 하세요 04.var once_per_browser=1; 05. 06.var ns4=document.layers 07.var ie4=document.all 08.var ns6=document.getElementById&&!document.all 09. 10.if (ns4) 11.crossobj=document.layers.postit 12.else if (ie4||ns6) 13.crossobj=ns6? document.getElementById("postit") : document.all.postit 14. 15. 16.function closeit(){ 17.if (ie4||ns6) 18.crossobj.style.visibility="hidden"19.else if (ns4) 20.crossobj.visibility="hide"21.} 22. 23.function get_cookie(Name) { 24. var search = Name + "="25. var returnvalue = ""; 26. if (document.cookie.length > 0) { 27. offset = document.cookie.indexOf(search) 28. if (offset != -1) { 29. offset += search.length30. end = document.cookie.indexOf(";", offset); 31. if (end == -1) 32. end = document.cookie.length; 33. returnvalue=unescape(document.cookie.substring(offset, end)) 34. } 35. } 36. return returnvalue; 37.} 38. 39.function showornot(){ 40.if (get_cookie('postdisplay')==''){ 41.showit() 42.document.cookie="postdisplay=yes"43.} 44.} 45. 46.function showit(){ 47.if (ie4||ns6) 48.crossobj.style.visibility="visible"49.else if (ns4) 50.crossobj.visibility="show"51.} 52. 53.if (once_per_browser) 54.showornot() 55.else56.showit() 57. 58.</script> 59. 60.<script language="JavaScript1.2"> 61. 62.// 드래그 앤 드롭 함수입니다 63.// ie4 이상에서만 지원됩니다 64. 65.function drag_drop(e){ 66.if (ie4&&dragapproved){ 67.crossobj.style.left=tempx+event.clientX-offsetx 68.crossobj.style.top=tempy+event.clientY-offsety 69.return false70.} 71.else if (ns6&&dragapproved){ 72.crossobj.style.left=tempx+e.clientX-offsetx 73.crossobj.style.top=tempy+e.clientY-offsety 74.return false75.} 76.} 77. 78.function initializedrag(e){ 79.if (ie4&&event.srcElement.id=="postit"||ns6&&e.target.id=="postit"){ 80.offsetx=ie4? event.clientX : e.clientX 81.offsety=ie4? event.clientY : e.clientY 82. 83.tempx=parseInt(crossobj.style.left) 84.tempy=parseInt(crossobj.style.top) 85. 86.dragapproved=true87.document.onmousemove=drag_drop 88.} 89.} 90.document.onmousedown=initializedrag 91.document.onmouseup=new Function("dragapproved=false") 92. 93.</script><!--------------------------- 여기까지 ---------------------------->
'java script' 카테고리의 다른 글
| 실시간 디지털 시계 만들기 스크립트 (0) | 2011.01.07 |
|---|---|
| 기념일 메세지와 함께 날짜 보여주기 (0) | 2011.01.07 |
| 상태바에 한글자씩 나타난후 스크롤되어 사라집니다 (0) | 2011.01.07 |
| 줄맞춰 춤추는 메세지들 (0) | 2011.01.07 |
| 네츠케이프에서는 반짝반짝, 익스플로러에서는 마키효과 (0) | 2011.01.07 |