[유용한팁] 유용한 자바스크립트 팁모음1
<script Language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
<body>부분..........
<span onMouseOver="MM_showHideLayers('layer1','','show','layer2','','hide')" style="cursor:hand">주메뉴1</span>
<br><br><span onMouseOver="MM_showHideLayers('layer1','','hide','layer2','','show')" style="cursor:hand">주메뉴2</span>
<div id="layer1" style="width:100px; height:200px; position:absolute; left:100px; top:85px; z-index:3; visibility:hidden;">
<a href="#">부메뉴</a><br>
<a href="#">부메뉴</a>
</div>
<div id="layer2" style="width:100px; height:200px; position:absolute; left:100px; top:108px; z-index:2; visibility:hidden;">
<a href="#">부메뉴</a><br>
<a href="#">부메뉴</a>
</div>
----------------------------------------------------------------------------------------------------------------------------------
5초후 자동으로 새창 띄우기
----------------------------------------------------------------------------------------------------------------------------------
html>
<head>
<title>apoka.net</title>
</head>
<body onload=cnt()>
<center>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<form name="form1" method="get">
<p align="center"><font size="2"><b><br> 5초후 자동으로 이동 합니다.</b></font><br>
<br>
<input type="text" name="text1" size="2" style="font-family:'Comic Sans MS'; font-size:60pt; text-align:center; border-width:0; border-style:solid;" readonly><br> <br>
</td>
</tr>
</table>
<script language="JavaScript">
<!--
if(document.all)document.write('<embed src="tting.wav" width="100" height="100" border="0" hidden="true" autostart="false"><embed src="tting2.wav" width="100" height="100" border="0" hidden="true" autostart="false">')
if(document.all)document.write('<bgsound id="kts">')
var timer1=null
var a=5
function cnt(){
form1.text1.value = a
a--
kts.src='tting.wav'
timer1=setTimeout('cnt()',1000)
if(a==-1){
kts.src='tting2.wav';
clearTimeout(timer1);
newwin= window.open('http://devpia.com','new','toolbar=yes,location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,resizeable=yes,width=1024,height=768,top=0,left=0')
}
}
//-->
</script>
</body>
</html>
----------------------------------------------------------------------------------------------------------------------------------
체크하면 테이블 색깔 바꾸기
----------------------------------------------------------------------------------------------------------------------------------
<html>
<SCRIPT LANGUAGE="JavaScript">
<!--
function check_user()
{
if (document.form.test1.checked == true)
{
obj1 = link_table.rows[0]; // 요건 테이블에 id를 주어서 거기의 row(즉 tr이 되겠죠.)를 변수로 선언하고
// obj1 = link_table.rows["aa"]; // 일케 해도 되요..
obj1.style.background = "red"; // 고넘의 속성을 변경시키는 겁니다.
}
else
{
obj1 = link_table.rows[0];
obj1.style.background = "white";
}
}
//-->
</SCRIPT>
<form name="form">
<BODY >
<table id="link_table" width="500" border="1">
<tr id="aa">
<td align=center ><input name="test1" type="checkbox" OnClick="check_user()"></td>
<td align=center >메뉴 1</td>
<td align=center >메뉴 2</td>
</tr>
</table>
</BODY>
</form>
</HTML>
----------------------------------------------------------------------------------------------------------------------------------
쿠키를 이용해서 북마크 페이지를 만드는 소스
----------------------------------------------------------------------------------------------------------------------------------
<script language="JavaScript">
<!--
var sepchar = "@"; // unique separator character
var BMtotal = 6; // max number of bookmarks permitted
var ShowCount = 0;
var expDays = 30; // 쿠키 지속 기간
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function ListBookmarks() {
var NumBookmarks = GetCookie('PT_NumBookmarks');
var i;
var Bookmark;
if (NumBookmarks == null) {
NumBookmarks = 0;
}
ShowCount = 0; SwapColour = 0;
for (i=1; i <= NumBookmarks ; i++) {
Bookmark = GetCookie('PT_Bookmark'+i);
if (Bookmark != null) {
PrintBookmark(Bookmark, i);
}
}
}
function DeleteBookmark(Count) {
DeleteCookie('PT_Bookmark'+Count);
window.location = window.location;
}
function PrintBookmark (Bookmark, Count) {
var pairs = Bookmark.split(sepchar);
pairs[0]= unescape(pairs[0]);
pairs[1]= unescape(pairs[1]);
var BMtitle = pairs[0];
var BMaddress = pairs[1];
ShowCount++; // 북마크 보여지는 부분의 소스 - <table>는 폼 구성 부분에.. -_-;;
document.write('<tr>');
document.write('<th width="90%"><a href="'+BMaddress+'"><font color="blue">'+BMtitle+'</font></a></th>');
document.write('<th width="10%"><a href="DeleteBookmark('+Count+')" onmouseover="window.status=''+BMtitle+'을/를 삭제합니다. (Count : '+Count+')'; return true" onmouseout="window.status=''; return true"><font color="blue">Delete</font></a></th>');
document.write('</tr>');
}
function AddBookmark(BMtitle, BMaddress) {
var NumBookmarks = GetCookie('PT_NumBookmarks');
var i;
var ToDoItem;
var Bookmark;
var OldestBookmark = 0;
var CountBookmarks = 0;
if (NumBookmarks == null) {
NumBookmarks = 0;
}
for (i=1; i <= NumBookmarks ; i++) {
Bookmark = GetCookie('PT_Bookmark'+i);
if (Bookmark != null) {
CountBookmarks++;
if (OldestBookmark == 0) {
OldestBookmark = i;
}
}
if (Bookmark == BMtitle+sepchar+BMaddress) {
alert(''+BMtitle+'이/가 북마크 되었습니다.'); // 북마크 되었다는 메세지
history.go(0); // 페이지 새로고침 - 북마크시 페이지 새로고침해야 나옴..
return; }
}
if (CountBookmarks > BMtotal) {
DeleteBookmark(OldestBookmark);
}
NumBookmarks++;
SetCookie('PT_Bookmark'+NumBookmarks, BMtitle+sepchar+BMaddress, exp);
SetCookie('PT_NumBookmarks',NumBookmarks, exp);
alert(''+BMtitle+'이/가 북마크 되었습니다.'); // 북마크 되었다는 메세지
history.go(0); // 페이지 새로고침 - 북마크시 페이지 새로고침해야 나옴..
}
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
function addurl() { // 폼의 값을 받는부분..
AddBookmark(''+document.cookie_bookmark.addurl_title.value+'','http://'+document.cookie_bookmark.addurl_url.value+'');
}
//-->
</script>
<!--
폼 구성 부분
아래 북마크 소스 출려하는 자스의 경우 꼭
<table>을 붙여줘야함..
//-->
<form name="cookie_bookmark" method="post">
<table border="0" width="300" cellspacing="0" cellpadding="2" style="border:1 solid #000000;">
<tr>
<th colspan="3" width="300">쿠키 북마크</th>
<tr>
<tr>
<th width="100">북마크 타이틀</th>
<td colspan="2" align="center" width="200"><input type="text" name="addurl_title" tabindex="1" style="width:100%;"></td>
</tr>
<tr>
<th width="100">북마크 경로</th>
<th width="45"><input type="text" value="http://"; style="width:45px;" tabindex="4"readonly></th>
<td align="center" width="155"><input type="text" name="addurl_url" tabindex="2" style="width:100%;"></td>
</tr>
<tr>
<td colspan="3" align="center" width="300"><input type="button" value="click" onclick="addurl();" tabindex="3" style="width:50%;"></td>
</tr>
<tr>
<td colspan="3" width="300"><Br>
<script language="JavaScript">
<!--
document.write('<table border="0" width="100%" cellspacing="0" cellpadding="2">');
ListBookmarks(); // 북마크를 출력하는 소스
document.write('</table>');
//-->
</script>
</td>
</tr>
</table>
</form>
----------------------------------------------------------------------------------------------------------------------------------
몇번째 방문했는지 알려주는 스크립트
----------------------------------------------------------------------------------------------------------------------------------
<head>
<script language="JavaScript">
<!--
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (2 < argc) ? argv[2] : null;
var path = (3 < argc) ? argv[3] : null;
var domain = (4 < argc) ? argv[4] : null;
var secure = (5 < argc) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DisplayInfo() {
var expdate = new Date();
var visit;
// Set expiration date to a year from now.
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
if(!(visit = GetCookie("visit")))
visit = 0;
visit++;
SetCookie("visit", visit, expdate, "/", null, false);
var message;
if(visit == 1)
message="감사합니다. Happy에 처음 오신분이군요.";
if(visit== 2)
message="다시 방문해 주셔서 감사합니다.";
if(visit == 3)
message="또 오셨군요. 감사합니다.";
if(visit == 4)
message="기쁩니다, 다시 뵙게 되어서.";
if(visit == 5)
message="요즘 어떻게 지내셨어요 ?";
if(visit == 6)
message="오늘은 자료실을 둘러 보시죠...";
if(visit == 7)
message="이제는 자주 들리시네요...";
if(visit == 8)
message="자주 뵙게되서 기쁘군요 !";
if(visit == 9)
message="오늘은 날씨가 어떤가요 ?";
if(visit >= 10)
message="언제 커피 한잔 하실래요!";
alert("n"+"어서오세요.nn"
+"이번이 "+visit+ "번째 방문입니다." + "nn"
+message);
}
function ResetCounts() {
var expdate = new Date();
expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 365));
visit = 0;
SetCookie("visit", visit, expdate , "/", null, false);
}
// -->
</script>
</head>
<body bgcolor="#f5f5f5"
text="#009999"
link="#0066cc"
vlink="#0066cc"
alink="#0099ff"
onLoad="DisplayInfo()">
<p align=CENTER>
<font face="굴림">
방문자에게 다른 메세지 보여주기
</font>
<p align="center">
<font face="굴림" size="2">
새로고침 을 해보세요<br>
그럼 인사말이 바뀔거예요
</font>
</body><input type=button name=simabuttonviewsource value="View Source" onClick='window.location="view-source:"+window.location.href'>