LANGUAGE/Java Script
[자바스크립트]유용 소스 26가지
랑스티비
2019. 4. 26. 15:58
[자바스크립트]유용 소스 26가지
1. 상황칸에 타자
<script language="javascript">
<!--
var i=1;
function ani(){
i++
if(i==5) {i=1;}
if(i==1) {window.status = "홈";}
if(i==2) {window.status = "홈페";}
if(i==3) {window.status = "홈페이";}
if(i==4) {window.status = "홈페이지";}
setTimeout("ani()",200);
}
//-->
</script>
<body onload="ani()">
2. 자동으로 타자
<script language="javascript">
<!--
var msg = new Array()
msg[0] = "홈페이지 만들기"
msg[1] = "홈페이지를 만드는데 도움이 되는"
msg[2] = "자료를 제공하고 있습니다."
var count = 0;
var offset = 0;
function show(){
var text = msg[count];
if(offset < text.length){
var message = text.substring(0,offset+1);
window.status = message;
offset++;
}else{
offset = 0;
count++;
if(count == msg.length){
count=0;
}
}
setTimeout("show()",100);
}
//-->
</script>
<body onload="show()">
3. 상황칸에 고정 제목
<script language="JavaScript">
statuss();
function statuss()
{
window.status = "마스터 포토샵(Master Photoshop)";
setTimeout("statuss()", 1);
}
</script>
4. iframe
<iframe frameborder="0" height="600" leftmargin="0" topmargin="0"
marginwidth="0" scrolling="no" src="http://사이트주소입력"
width="550"></iframe>
5. 미디어재생
<embed src="파일명" width="150" height="50" border="0"
type="audio/x-pn-realaudio-plugin"
autostart="true">
------------- wav.mp3.mpeg 재생 -----------
<embed src="파일명" width="246" height="239"
border="0" autoplay="yes" loop="yes">
6. mouse event 셀 위에 올라갈때
첫번째(셀에 각자의 칼라부여)
<td width="50" bgcolor="#66FFFF"
onmouseover="this.style.background='#ACB4FF'"
onmouseout="this.style.background='#66FFFF'">aaaa</td>
7. 화면slow모션
<head>
<META http-equiv="Page-Enter" content="BlendTrans (Duration=3)">
<META http-equiv="Page-Exit" content="BlendTrans (Duration=3)">
</head>
8. 마우스over
<style>
<!--
A:link {text-decoration:none; color:red;}
A:visited {text-decoration:none; color:red}
A:active {text-decoration:none; color:red}
A:hover {text-decoration:none; color:red; font-weight:bold; letter-spacing:-1;}
-->
</style>
-- 추가옵션 --
A:hover { BACKGROUND-COLOR: yellow}
9. 줄맞추기 / 폰트 break
<style="text-align:justify">
<style="word-break:break-all;">
(td 안에 단어형태 줄바꿈을 무시하고 폰트를 깨고 줄바꿈을 한다)
10. 폰트 설정
<font style="font-size:11px;">정교한 폰트픽셀</font>
11.바디 폰트스타일 스타일
<body style="font-family:돋움; font-size:12px;">
12. box border 스타일
<input type="text" style="border:1 gray solid">
13. 스크롤바 변경 body,textarea
<style type="text/css">
BODY
{scrollbar-3dlight-color:#dddddd;
scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#999999;
scrollbar-face-color:#ffffff;
scrollbar-track-color:#f2f2f2;
scrollbar-shadow-color:#ffffff;
scrollbar-darkshadow-color:#999999;}
</style>
// textarea 변경
<style>
TEXTAREA {
font-family:;
font-size: 9pt;
overflow:auto
color: #666666;
border:1 solid #cccccc;
scrollbar-3dlight-color:#dddddd;
scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#999999;
scrollbar-face-color:#ffffff;
scrollbar-track-color:#f2f2f2;
scrollbar-shadow-color:#ffffff;
scrollbar-darkshadow-color:#999999;
}
14. 폰트효과
<font style="height:41; width:200; font-size:23; filter:shadow(color=blue)"><b><font color="aqua">푸하하</b></font>
15. 소스비공개
<script language="JavaScript">
function click() {
if ((event.button==2) || (event.button==3)) {
alert!('소스비공개입니다');
}
}
document.onmousedown=click
</script>
16. 드래그 불능
<body onload="return false;" oncontextmenu="return false" ondragstart="return false" onselectstart="return false">
17. 백그라운드고정 img
bgproperties="fixed"
18. 백그라운드 이미지 스타일
style="BACKGROUND-POSITION: left top; BACKGROUND-ATTACHMENT: fixed; BACKGROUND-IMAGE: url(/images/bg_sub04.jpg); BACKGROUND-REPEAT: repeat-x;"
19. 입력폼에 주석입력
<input type=text name=write size=15 value="내용을 입력하세요" onFocus="javascript:value=''">
20. 입력폼에 이미지삽입 & 제거
<script type="text/javascript">
function idclear() {
document.login.id.style.backgroundImage = '';
}
function pwclear() {
document.login.pw.style.backgroundImage = '';
}
</script>
<form name="login">
<input type="text" name="id" value="" onFocus="idclear();" style="background:url(input_id.gif);" >
<input type="password" name="pw" value="" onFocus="pwclear();" style="background:url(input_pw.gif);" >
</form>
21. 윈도우 리프래쉬로 새로운창으로 변경
<META HTTP-EQUIV="Refresh" CONTENT="0; URL=http://kr.yahoo.com">
22. 윈도우 테두리확장
<script language="JavaScript">
function ml_open(){
pbml_win = window.open("http://yahoo.co.kr", "insideu", s='top=0,left=0,width='+
(screen.availWidth-10)+',height='+(screen.availHeight-70)+',toolbar=yes,status=0,resizable=yes');
return;
}
</script>
<a href="javascript:ml_open()" target="_self">들어가기</a>
23. javascript:즐겨찾기
<a href="javascript:window.external.AddFavorite('http://www.yahoo.co.kr/','야후 즐겨찾기 추가')">즐겨찾기추가</a>
24. 부모와 자식창 링크
function opener_loc()
{
opener.location!='/event.asp'
self.close();
}
25. Blink
function doBlink() {
var blink = document.all.tags("BLINK")
for (var i=0; i < blink.length; i++)
blink[i].style.visibility = blink[i].style.visibility == "" ? "hidden" : ""
}
function startBlink() {
if (document.all)
setInterval("doBlink()",300)
}
window.onload = startBlink;
반짝반짝거립니다
26. input, textarea 배경색 투명
INPUT, TEXTAREA {background-color:transparent}