태그, 홈페이지제작 등 각종지식 정보가 있습니다
![[레벨:7]](http://www.coffeemint.net/modules/point/icons/default/7.gif "포인트:5056point (47%), 레벨:7/30"){kind=icon}
☞ 랜덤 인덱스창 띄우기
<body>
<!-- 삽입해야 할 소스 시작 -->
<script language="Javascript">
<!--
myPage=new Array() // 바뀌며 보여줄 index 파일을 정해주세요.
myPage[0]="index01.html"
myPage[1]="index02.html"
myPage[2]="index03.html"
today=new Date()
len=3 // 인덱스 페이지의 바뀔갯수를 정해주세요
today2=today.getTime()/10
rnd=today2 % len
location.replace(myPage[rnd])
//-->
</script>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 로딩시 노래 3곡을 랜덤으로 듣기
<head><title>음악 3가지 랜덤으로 듣기</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
var sound1="../music/김건모 - 제비.mp3"
var sound2="../music/거북이 - 왜이래.mp3"
var sound3="../music/DJ DOC - DOC와함께춤을.mp3"
var x=Math.round(Math.random()*2)
if (x==0) x=sound1
else if (x==1) x=sound2
else if (x==2) x=sound3
else x=sound3
if (navigator.appName=="Microsoft Internet Explorer")
document.write('<bgsound src='+'"'+x+'"'+' loop="infinite">')
else
document.write('<embed src='+'"'+x+'"'+'hidden="true" border="0" width="20" height="20" autostart="true" loop="true">')
</script>
<!-- 삽입해야 할 소스 끝 -->
</head>
☞ 본문의 텍스트가 랜덤으로(오늘의 명언)
<head><title>오늘의 명언 스크립트</title>
<!-- 삽입해야 할 소스 시작 -->
<SCRIPT language="JavaScript"><!-- Activate Cloaking Device
// Variables for random number generator.
today=new Date();
jran=today.getTime();
// Set to number of quotes available.
var number=5;
// Becomes generated random number.
var random_number=0;
// Random number generating function.
// Original generator by Paul Houle (ph18@cornell.edu)
ia=9301;
ic=49297;
im=233280;
jran = (jran*ia+ic) % im;
random_number=Math.ceil( (jran/(im*1.0)) *number);
quotes = new Array(12);
authors = new Array(12);
quotes[0] = "저번 이사때 없어진 물건 이번 이사때 나온다.";
authors[0] = "이사짐센터 아저씨.";
quotes[1] = "남자는 여자하기 나름이다.";
authors[1] = "최진실";
quotes[2] = "사랑은 눈물의 씨앗...";
authors[2] = "나훈아";
quotes[3] = "전화를 잘못 걸었을때 통화중인 적은 없다...";
authors[3] = "우리 누나.";
quotes[4] = "여자는 운전중 길을 모르면 주유소에서 물어본다.<br>그러나 남자는 끝까지 헤메다가 기름이 떨어져 주유소에 들르게 되면 물어 본다.";
authors[4] = "주유소 아르바이트생...";
// -->
</SCRIPT>
</HEAD>
<body bgcolor="#000080" text="#FFFFFF">
<br><br><br>
<table width="550"><td align="center"><font size="2" color="#FFFFFF">
오늘의 명언 입니다.
<SCRIPT language="JavaScript">
<!--
//display the quotation
document.open();
document.write("<center><dl>\n");
document.write("<dt>" + "\"" + quotes[random_number-1] + "\"\n");
document.write("<dd>" + "- " + authors[random_number-1] + "- " + "\n");
document.write("</dl>\n</center>");
// -->
</script>
</font><font size="2" color="#00FF00">
</SCRIPT></font></td></table>
<!-- 삽입해야 할 소스 끝 -->
<br><br>
<table width="550"><td><font size="2">
위의 스크립트가 삽입된 페이지가 읽혀질 때 마다 새로운 오늘의 명언을 띄웁니다.
물론 내용을 바꿔서 다른 메세지가 뜨도록 수정 할 수도 있죠.</font></td>
</table><br>
<p><br>
</body>
☞ 이미지가 랜덤으로 바뀌기
<body>
<!-- 삽입해야 할 소스 시작 -->
<SCRIPT LANGUAGE="JavaScript">
var BgArray = new Array(
"../skc/skc-dog01.jpg",
"../skc/skc-dog02.gif",
"../skc/skc-kiti01.jpg",
"../skc/skc-kiti02.jpg"
);
var gifimage="";
var picfolder="./";
today=new Date();
jran=today.getTime();
ia=9301;
ic=49297;
im=233280;
jran = (jran*ia+ic) % im;
gifimage = picfolder+BgArray[ ( Math.ceil((jran/(im*1.0))
*BgArray.length) ) - 1];
document.write("<center><img src='"+gifimage+"'></center>");
</script>
<!-- 삽입해야 할 소스 끝 -->
</body>
▣ 팝업창 띄우기
|
| ||
| no, 1을 사용 | width=800 : 팝업창의 넓이 | height=600 : 팝업창의 높이 |
| top=0 : 팝업창이 뜰 위치 | left=0 : 팝업창이 뜰 위치 | resizable=1 : 창크기 조정가능 |
| scrollbars=1 : 스크롤바 | menubar=1 : 메뉴 | toolbar=1 : 메뉴아이콘 |
| location=1 : 제목표시줄 | directories=1 : 연결버튼(핫메일 등) | status=1 : 하단의 상태바 |
☞ 로딩시 팝업창 띄우기
<head>
<title>로딩시 자동으로 팝업창 띄우기</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="javascript">
<!--
function OpenWindow() {
window.open("insa-hi.html","_blank","top=0,left=0,width=470,height=340,resizable=1,scrollbars=no");
}
//-->
</script>
</head>
<body onLoad="OpenWindow()">
<!-- 삽입해야 할 소스 끝 -->
또는
<!-- 삽입해야 할 소스 시작 -->
<body onload="window.open('insa-hi.html', 'new', 'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no, resizable=no,width=470,height=340')">
<!-- 삽입해야 할 소스 끝 -->
☞ 종료시 팝업창 띄우기
<!-- 삽입해야 할 소스 시작 -->
<body onunload="popup();">
<script language=javascript>
<!--
function popup()
{
window.open("testby.html", "_blank",
"top=0,left=0,width=463,height=178" +
",toolbar=1,status=1,scrollbars=0,resizable=0");
}
-->
</script>
<!-- 삽입해야 할 소스 끝 -->
또는
<!-- 삽입해야 할 소스 시작 -->
<body onunload="window.open('testby.html')">
<!-- 삽입해야 할 소스 끝 -->
☞ 클릭을 하면 팝업창이 뜨는 스크립트
<title>링크 클릭시 팝업창 띄우기</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="javascript">
<!--
function OpenWindow(url,intWidth,intHeight) {
window.open(url, "_blank", "width="+intWidth+",height="+intHeight+",resizable=1,scrollbars=1") ;
}
//-->
</script>
</head>
<body>
<br>
<center>
<a href="javascript
</center>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 로딩시와 종료시에 모두 팝업창 띄우기
<!-- 삽입해야 할 소스 시작 -->
<!--입장 팝업 소스 -->
<body onunload="popup();">
<SCRIPT LANGUAGE="JavaScript">
<!--
function popup( partner )
{
window.open("insa-hi.html", "_blank", "top=0,left=0,width=450,height=340",
"toolbar=1,status=1,scrollbars=1,resizable=1");
}
popup( );
-->
</SCRIPT>
<!--퇴장 팝업 소스 -->
<script language=javascript>
<!--
function popup()
{
window.open("insa-by.html", "_blank", "top=0,left=0,width=470,height=350",
"toolbar=1,status=1,scrollbars=0,resizable=0");
}
-->
</script>
<!-- 삽입해야 할 소스 끝 -->
▣ 메세지박스 띄우기
☞ 로딩시 메세지 박스 띄위기
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
<!--
function checkage(){if (!confirm ("자주오면 확인 아니문 취소"))
history.go(-1);return " "}
document.write(checkage())
// -->
</script>
<!-- 삽입해야 할 소스 끝 -->
</head>
☞ 로딩시 질문 메세지 박스 띄우기
<body>
<!-- 삽입해야 할 소스 시작 -->
<script language="vbscript">a=msgbox("홈피 좋아요?", vbyesno):
if a = vbyes then msgbox "알라뷰~♡" else msgbox "미워잉^^;"</script>
<!-- 삽입해야 할 소스 끝-->
</body>
</html>
<!-- 스크립트 부분을 head 부분에 삽입하면 body의 내용을 보여주지 않고 메세지 상자가 나오며
스크립트 부분을 body의 마지막 부분에 삽입하면 body의 내용을 보여주면서 메세지 상자가 나옵니다 -->
☞ 로딩시, 종료시 인사 메세지 띄우기
<!-- 삽입해야 할 소스 시작 -->
<body onLoad="alert('안녕하셨나요?');" onUnload="alert('난중에 또 뵈요!');" bgcolor="#000080">
<!-- 삽입해야 할 소스 끝 -->
▣ 사이트 이동
☞ 로딩시 카우터다운 후 다른사이트로 이동(홈페이지 주소 이동시)
<head><title>카운터다운 후 다른 사이트로 이동</title>
</head>
<body bgcolor="#000080">
<!-- 삽입해야 할 소스 시작 -->
<div align="center">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<form name="form1" method="get">
<center"><font size="2" color="#FFFFFF"><b><br>
카운터가 끝나면 자동으로 이동합니다.</b></font>
<font color="#FFFFFF"><br> </font> <br>
<input type="text" name="text1" size="3" style="font-family:'Times New Roman';
font-size:60pt; text-align:center; border-width:0; border-style:solid;" readonly></center><br>
<script>
<!--
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="zsam">')
var timer1=null
var a=5 <!-- 여기에 10을 입력하면 10부터 카운터다운 됩니다. -->
var GoUrl='http://ajujon.com.ne.kr'
function connect(){
form1.text1.value = a
a--
zsam.src='tting.wav'
timer1=setTimeout('connect()',1000)
if(a==-1){zsam.src='tting2.wav';clearTimeout(timer1);setTimeout('top.location=GoUrl',1000)}
}
if(document.all)window.onload=connect
function connect2(){
clearTimeout(timer1)
form1.text1.value='Go'
setTimeout('top.location=GoUrl',1000)
}
//-->
</script>
</td>
</tr>
</table>
</div>
</form>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 로딩시 다른사이트로 이동(홈페이지 주소 이동시)
<head>
<!-- 삽입해야 할 소스 시작 -->
<title>몇초후에 다른창이 뜨는 태그</title>
<SCRIPT>
setTimeout("window.open('insa-hi.html');", 5000);
// 5초 후에 띄웁니다
//같은 창에 띄울때는 ('http://www.molca10tv', target='_top');"
</SCRIPT>
<!-- 삽입해야 할 소스 끝 -->
</head>
또는
<HEAD>
<TITLE>홈페이지 이동하였을 때 이용하세요</TITLE>
<!-- 삽입해야 할 소스 시작 -->
<META http-equiv="Refresh" content="5; URL=insa-hi.html">
<!--홈페이지가 다른 곳으로 이사했을때 종종 사용들 하시죠. -->
<!--Content=5 은 몇초 후에 이동 시간 -->
<!-- 삽입해야 할 소스 끝 -->
</HEAD>
▣ 시간 관련
☞ 상태바에 방문자의 머문시간을 나타내는 스크립트
<head><TITLE>머무른 시간이 상태바에서</TITLE>
<!-- 삽입해야할 소스 시작 -->
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin script hide
/*
JavaScript coded in full by Craig McKinnon
http://www.WarpLink.com/~sandym
sandym@WarpLink.com
*/
var min_inc = 0, sec_inc = -1;
function browsing_time()
{
if (sec_inc == 59) min_inc++;
sec_inc = (sec_inc + 1) % 60; // reset sec_inc to 0 after 59 seconds
// Display "minutes" or "minute" (<-- for 1 minute and second)
// and proper 0's
if (min_inc == 1)
var min_no = min_inc + ' minute';
else var min_no = min_inc + ' minutes';
if (sec_inc >= 10)
var sec_no = sec_inc;
else var sec_no = '0' + sec_inc;
var sec_txt = ' seconds.';
if (sec_inc == 1)
sec_txt = ' second.';
var elapsed = '당신이 머무른 시간 ' + min_no + ' '+ sec_no + sec_txt;
defaultStatus = elapsed;
setTimeout("browsing_time()", 1000);
}
// End script hide -->
</SCRIPT>
<!-- 삽입해야할 소스 끝 -->
</HEAD>
<BODY bgcolor="#000080" text="#FFFFFF" link="#0000FF" vlink="#800080" alink="#FF0000" onload="browsing_time();">
<TABLE border="0" cellpadding="0" cellspacing="0" width="100%">
<TR>
<TD width="100%" align="left" valign="top"><P align="center"><FONT face="굴림" size="2" color="#FFFFFF">상태바를 보시면 당신이 머무른 시간이 나타납니다.</FONT></P>
<P align="center"> </TD>
</TR></TABLE>
<br><br>
</body>
☞ 방문자의 머문시간을 나타내는 스크립트
<html> <head><title>머문시간</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
function anzaraTimer(){
var time = new Date();
var hours = time.getHours();
var mins = time.getMinutes();
var secs = time.getSeconds();
enterTime = hours*3600 + mins*60 + secs;
Timer();
}
function Timer() {
var time = new Date();
var hours = time.getHours();
var mins = time.getMinutes();
var secs = time.getSeconds();
curTime = hours*3600 + mins*60 + secs;
compTime();
}
function compTime() {
count = curTime - enterTime;
hour = parseInt(count/3600);
min = parseInt((count%3600)/60);
min = ((min < 10) ? "0" : "") + min;
sec = (count%3600) % 60;
sec = ((sec < 10) ? "0" : "") + sec;
document.timer.counter.value = hour + ":" + min + ":" + sec;
window.setTimeout("Timer()",1000);
}
</script>
</head>
<body onload="anzaraTimer();">
<FORM name="timer" method="get">
머문시간
<INPUT type="text" style="border: black 1 solid; height: 19; width:50;" name="counter">
</FORM>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 시간을 나타내주는 스크립트
<!-- 삽입해야 할 소스 시작 -->
<body bgcolor=#000080 onLoad="loadclock()">
<p>
<!-- 아래의 Text Area않에 있는 코드를 사용하고자 하는 html문서의
<BODY> 부분중 자신이 보여지길 원하는 부분에 삽입해 주세요.
"var ctime=..." 부분을 수정해 주시면 시계의 색깔과 크기 글자 모양등을 바꾸실수 있습니다. -->
<div ALIGN="center">
<span id=tick2>
</span>
<script>
<!--
function show2(){
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var dn="AM"
if (hours>12){
dn="PM"
hours=hours-12
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
var ctime="<b><font face='Verdana' color='#ffffff'>"+hours+":"+minutes+":"+seconds+" "+dn+"</font></b>"
if (!document.all)
document.write(ctime)
else
tick2.innerHTML=ctime
}
function loadclock(){
if (document.all)
setInterval("show2()",1000)
}
if (!document.all)
show2()
//-->
</script>
</div>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 시간마다 다른인사하기
<head><title><시간마다 다른 인사하기</title>
</head>
<body>
<!-- 삽입해야 할 소스 시작 -->
<CENTER><font color=hotpink>회원님~~</FONT>
<script language="JavaScript">
<!--
document.write("<font color=hotpink>")
day = new Date()
hr = day.getHours()
if (hr ==1)
document.write("아직은 이르죠 새벽 1시 입니다")
if (hr ==2)
document.write("새벽 2시가 되었습니다 밤늦게 방문해 주시다니..고맙습니다")
if (hr ==3)
document.write("새벽 3시도 입니다 아직도 안졸리세요")
if (hr ==4)
document.write("벌써 새벽~4시입니다 밤 늦게 머하세요?")
if (hr ==5)
document.write("새벽~5시입니다...일찍 일어나셨네요...안잔 거면...빨리자세요~!")
if (hr ==6)
document.write("드뎌~ 아침이다. 새벽~~~6시 통과 사람들이 하나둘 일어날 시간!")
if (hr ==7)
document.write("아침 7시네요 아침드셔야죠^^")
if (hr ==8)
document.write("아침~8시도 통과 ㅠ.ㅠ등교,출근 안 하세요?")
if (hr ==9)
document.write("아침 9시 통과, 모하세요?")
if (hr ==10)
document.write("오전 10시 넘어네요")
if (hr ==11)
document.write("냐호~ 곧 점심시간 이군요. 11시 통과~")
if (hr ==12)
document.write("움.. 점심시간이군요. 12시 지남")
if (hr ==13)
document.write("졸리겠다. 오후 1시 통과")
if (hr ==14)
document.write("쨍쨍~ 오후 2시도 통과~")
if (hr ==15)
document.write("오후 3시 넘었어요")
if (hr ==16)
document.write("오후~4시가 되었어요 젤 심심할때..")
if (hr ==17)
document.write("오후~5시도 넘었구요.만화할 시간이당!!")
if (hr ==18)
document.write("오후 6시네요 세이에서 접속자수가 많은 시간^^")
if (hr ==19)
document.write("저녁이군요 맛있는 저녁 드세요~냠냠~")
if (hr ==20)
document.write("벌써 저녁 8시가 지나갔네요.")
if (hr ==21)
document.write("밤 9시 입니다 어린이는 일찍 자세요*^^*")
if (hr ==22)
document.write("밤 10시군요~방문해 주셔서 감사합니다 ")
if (hr ==23)
document.write("오늘이 지나가는군요. 밤 11시 입니다")
if (hr ==0)
document.write("새로운 하루가 시작됐어요.오늘하루도 좋은 하루되세엽*^^*")
document.write("</font>")
// End -->
</script>
<!-- 삽입해야 할 소스 끝 -->
</body>
▣ 소스 관련
☞ 소스보기 버튼 만들기
<head><title>소스보기 버튼 만들기</title>
</head>
<body> <center>
즐거운 하루되세요<br><br>
<!-- 삽입해야 할 소스 시작 -->
<input type="button" value="소스보기" onclick='parent.window.location = "view-source:" + window.location.href'
onmouseover="this.style.color='#ff00ff'; this.style.background='#FEF5F5';"
onmouseout="this.style.color='#FB3375'; this.style.background='FFCCCC';">
<p></center>
<!-- 삽입해야 할 소스 끝 -->
</body>
또는
<body>
<font color="#0000FF">
<!-- 삽입해야 할 소스 시작 -->
<script>
<!--
/* View-source script credit:
By Website Abstraction (www.wsabstract.com)
Over 200+ free JavaScripts here!
*/
function viewthesource(){
window.location="view-source:"+window.location
}
//-->
</script>
</font>
<div ALIGN="center">
<a href="javascript
</div>
<div ALIGN="center">
<font SIZE=2 color="#0000FF">위의 링크를 클릭해 보세요.. 지금 페이지의 소스코드가 메모장으로 보여요..</font> </div>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 소스보기 금지(경고메세지)
<head><title>마우스 오른쪽버튼 사용시 경고창</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
function click() {
if ((event.button==2) || (event.button==3)) {
alert('보안상 마우스 오른쪽버튼 사용금지\n 죄송해유 ㅠㅠ '); //이곳에 하고 싶은 말을 쓰면되여.
}
}
document.onmousedown=click
</script>
<!-- 네비게이트용 -->
<script language="JavaScript">
<!-- Hide from old browsers
if (navigator.appName == "Netscape") {
document.captureEvents(Event.MOUSEDOWN)
document.onmousedown = checkClick
function checkClick(ev) {
if (ev.which != 1) {
alert('보안상 마우스 오른쪽 버튼은 사용할수 없습니다.')
return false
}
}
}
// -->
</script>
<!-- 삽입해야 할 소스 끝 -->
</head>
<body>
<table align="center" cellpadding="0" cellspacing="0" width="430" height="300" background="../skc/skc-board01.jpg">
<tr>
<td align="right" valign="top">
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center">
<font face="굴림" size="5" color="blue"><b><br>찾아주셔서 감사합니다. ~_*<br><br>
앞으로 즐거운 시간 되세요 ^_^</b></font></p>
</td>
</tr>
</table>
</body>
☞ 소스보기 금지(창닫기 메세지)
<head><title>소스를 볼수 있을까?</title>
<!-- 삽입해야 할 소스 시작 -->
<script language='JavaScript'>
function click() {
if ((event.button==2) || (event.button==3)) {
if(confirm('창을 닫으시겠습니까?')) window.close();
}
}
function press_key() {
if(confirm('창을 닫으시겠습니까?')) window.close();
}
document.onmousedown=click;
document.onkeydown=press_key;
// -->
</script>
<script language='JavaScript'>
<!-- Hide from old browsers
if (navigator.appName == 'Netscape') {
document.captureEvents(Event.MOUSEDOWN)
document.onmousedown = checkClick
function checkClick(ev) {
if (ev.which != 1) {
if(confirm('창을 닫으시겠습니까?')) window.close()
return false
}
}
}
// -->
</script>
<!-- 삽입해야 할 소스 끝 -->
</head>
<BODY BGCOLOR="#000080" text="#FFFFFF">
소스를 볼수 있을까??
</BODY>
☞ 소스보기 금지(다른창으로 자동으로 이동)
<head><title>소스를 보려고 하면 강제로 페이지 이동</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JAVAscript">
function click() {
if ((event.button==2) || (event.button==3) || (event.keyCode == 93)) {
window.open("insa-by.html"); <!-- window.open("이동시킬주소") -->
return false;
}
}
document.onmousedown=click
document.onkeydown=click
</script>
<!-- 삽입해야 할 소스 끝 -->
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table align="center" cellpadding="0" cellspacing="0" width="430" height="300" background="../skc/skc-board01.jpg">
<tr>
<td align="right" valign="top">
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center">
<font face="굴림" size="5" color="blue"><b><br>안녕하세요. ~_*<br><br>
즐거운 시간 되세요 ^_^</b></font></p>
</td>
</tr>
</table>
</body>
▣ 마우스 효과
☞ 링크에 마우스를 스치기만 해도 창이 열리는 소스
<head><title>링크에 마우스만 대도 창이 열리는 소스</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
function MM_openBrWindow(theURL,winName,features)
{
window.open(theURL,winName,features);
}
<!-- Edited by http://1zin.com -->
</script>
</head>
<body>
<table align=center width=500 height=1000 border=1>
<tr>
<td><center>
<h1><a target="_blank" onmouseover="MM_openBrWindow('test.html','face','scrollbars=no,width=450,height=200')" style='cursor:hand'>마우스를 여기에</a>
<!--♣마우스 대면 새창이 뜨는 링크태그부분입니다. 문서명(test.htm), 스크롤바의 유무(no), 새창의 가로길이(300), 세로길이(50)을 적당히 수정하신후에 원하는곳에 넣으세요--> </h1></center></td>
</tr>
</table>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 클릭을 하면 팝업창이 뜨는 스크립트
<head><title>링크 클릭시 팝업창 띄우기</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="javascript">
<!--
function OpenWindow(url,intWidth,intHeight) {
window.open(url, "_blank", "width="+intWidth+",height="+intHeight+",resizable=1,scrollbars=1") ;
}
//-->
</script>
</head>
<body>
<br>
<center>
<a href="javascript
</center>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 글씨 바탕색 롤오버 효과
<head><title>OnMouseOver</title>
<!-- 삽입해야 할 소스 시작 -->
<STYLE TYPE="text/css">
<!--
A:link {font: Arial,Helvetica; text-decoration: none; color: #0000FF}
A:visited {font: Arial,Helvetica; text-decoration: none; color: #0000FF}
A:active {font: Arial,Helvetica; text-decoration: none; color: #000000}
A:hover {font: Arial,Helvetica; color: #0000FF; background-color: #FF0000}
-->
</STYLE>
</head>
<body bgcolor="#000080" text="#FFFFFF" link="#FFFFFF" vlink="#FFFF00" alink="#00FF00">
<CENTER><A HREF="javascript
"<u>예제로 가기</u>"에 마우스로 올려놓아보세요..<br><br>
이건 스크립트라기보다는 ..스타일 시트라고나 할까...
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 마우스를 대면 그림의 크기가 바뀌는 스크립트
<head><title>마우스를 대면 그림의 크기가 바뀌는 스크립트</title>
</head>
<body>
<!-- 삽입해야 할 소스 시작 -->
<img id="aimage" src = "../ptf/ptf-flower26.jpg" onMouseover="enlarge()" onMouseout="revertback()">
<script language="JavaScript1.2">
<!-- 여기서 부터 확대 사이즈 -->
function enlarge()
{ aimage.style.pixelWidth=600
aimage.style.pixelHeight=500}
<!-- 여기서 부터 원본 사이즈 -->
function revertback()
{ aimage.style.pixelWidth=400
aimage.style.pixelHeight=300}
</script>
<!-- 삽입해야 할 소스 끝 -->
</body>
☞ 마우스를 대면 이미지가 진하게 보이는 스크립트
<head><title>마우스를 대면 이미지가 진하게 보이는 스크립트<?title>
</head>
<body>
<!-- 삽입해야 할 소스 시작 -->
<SCRIPT LANGUAGE="JavaScript">
<!--
// IE 브라우저의 스타일 시트
if ((navigator.appName.indexOf('Microsoft')+1)) {
document.write('<style type="text/css">');
document.write('.opacity1 {filter:alpha(opacity=50)}');
document.write('.opacity2 {filter:alpha(opacity=100)}');
document.write('</style>');
}
// NS 브라우저의 스타일 시트
if ((navigator.appName.indexOf('Netscape')+1)) {
document.write('<style type="text/css">');
document.write('.opacity1 {-moz-opacity:0.5}');
document.write('.opacity2 {-moz-opacity:1}');
document.write('</style>');
}else{
document.write(''); }
//-->
</script>
<a href="#"><img src="../skc/skc-kiti01.jpg" border="0" class="opacity1" onmouseover="this.className='opacity2'" onmouseout="this.className='opacity1'"></a>
<a href="#"><img src="../skc/skc-kiti02.jpg" border="0" class="opacity1" onmouseover="this.className='opacity2'" onmouseout="this.className='opacity1'"></a>
<!-- 삽입해야 할 소스 끝 -->
<table align="center" border="1" width="250" height="80" bgcolor="white">
<tr><td><center><b>안녕하세요! ^_^</b></center></td></tr>
</table>
</body>
☞ 마우스를 대면 그림이 바뀌는 스크립트
<head><title>롤오버 이미지 만들기</title>
<!-- 삽입해야 할 소스 시작 -->
<script language="JavaScript">
<!--
function na_restore_img_src(name,
nsdoc)
{
var img = eval((navigator.appName == 'Netscape')
? nsdoc+'.'+name : 'document.all.'+name);
if (name == '')
return;
if
(img && img.altsrc) {
img.src =
img.altsrc;
img.altsrc = null;
}
}
function
na_preload_img()
{
var img_list = na_preload_img.arguments;
if
(document.preloadlist == null)
document.preloadlist
= new Array();
var top = document.preloadlist.length;
for
(var i=0; i < img_list.length; i++) {
document.preloadlist[top+i]
= new Image;
document.preloadlist[top+i].src
= img_list[i+1];
}
}
function na_change_img_src(name,
nsdoc, rpath, preload)
{
var img = eval((navigator.appName
== 'Netscape') ? nsdoc+'.'+name : 'document.all.'+name);
if (name
== '')
return;
if (img) {
img.altsrc
= img.src;
img.src = rpath;
}
}
//-->
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red"
OnLoad="na_preload_img(false, '../skc/skc-kiti01.jpg');">
<a href="#" OnMouseOut="na_restore_img_src('abc', 'document')"
OnMouseOver="na_change_img_src('abc', 'document', '../skc/skc-kiti01.jpg', true);">
<img src="../skc/skc-kiti02.jpg" border="0" name="abc"></a>
<!-- 삽입해야 할 소스 끝 -->
<!-- 소스 설명
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red"
OnLoad="na_preload_img(false, '마우스 갖다댔을때 나타날 그림주소');">
<a href="#" OnMouseOut="na_restore_img_src('그림의이름', 'document')"
OnMouseOver="na_change_img_src('그림의이름', 'document', '마우스 갖다댔을대 나타날 그림주소', true);">
<img src="그냥 보이는 그림주소" border="0" name="그림의이름"></a>
만약에 한 개 이상의 롤오버아이콘을 만들때는
파란부분에 가로를 닫기전에 똑같은 형태로 주소만 추가해 주시면 되요.
OnLoad="어쩌구저쩌구(false, '주소', '주소');"
이렇게 말이죠.
소스 설명 끝 -->
</body>
☞ 마우스를 대면 필터를 이용해 그림이 바뀌는 스크립트
<head><title>필터로 마우스 롤오버시 이미지 변화</title>
</head>
<body>
<!-- 삽입해야 할 소스 시작 -->
흑백효과<br>
<a href="http://ajujon.com.ne.kr">
<!-- 삽입해야 할 소스 시작 -->
<img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='gray'" onmouseout="this.style.filter=''"></a><br><br>
<!-- 삽입해야 할 소스 끝 -->
반전효과<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='invert'" onmouseout="this.style.filter=''"></a><br><br>
X-ray효과<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='xray'" onmouseout="this.style.filter=''"></a><br><br>
좌우로 이미지 변경<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='fliph'" onmouseout="this.style.filter=''"></a><br><br>
상하로 이미지 변경<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='flipv'" onmouseout="this.style.filter=''"></a><br><br>
물결효과<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='wave'" onmouseout="this.style.filter=''"></a><br><br>
안개효과<br>
<a href="http://ajujon.com.ne.kr"><img src="../ptf/ptf-baekilhong.jpg" width="500" height="300"
onmouseover="this.style.filter='blur'" onmouseout="this.style.filter=''"></a><br><br>
<!-- 삽입해야 할 소스 끝 -->
<!-- 소스 설명
<img src="그림주소" onmouseover="this.style.filter='필터이름'" onmouseout="this.style.filter=''"></a>
onmouseover -> 마우스를 올려쓸때 나타나는 필터
onmouseout -> 마우스를 내려놔쓸때 나타나는 필터
1.gray : 흑백 2.invert : 반전 3. xray : 엑스레이 효과
4.fliph : 좌 우 로 이미지변경 5. flipv : 상 하 로 이미지변경
6.wave : 물결효과 7. blur : 안개효과
-->
</body>
맨 위로
최근등록 댓글