[자바스크립트]유용 소스 26가지

티스토리 뷰

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}

저작자표시 (새창열림)

'LANGUAGE > Java Script' 카테고리의 다른 글

window.print() 속성 사용 (0)	2019.04.29
윈도미디어플레이어의 PARAM속성 활용법 (0)	2019.04.29
PC 인지 모바일인지 알려주는 자바스크립트 (0)	2019.03.14
javascript 변수 동적으로 생성하기 (0)	2019.03.14
javascript의 문자로 된 날짜 유효성검사 예)20180101 (2)	2019.03.12

'LANGUAGE/Java Script' 카테고리의 다른글

공지사항

최근에 올라온 글

최근에 달린 댓글

Total

Today

Yesterday

링크

TAG more

« 2026/02 »
일	월	화	수	목	금	토
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28

글 보관함

티스토리 뷰

[자바스크립트]유용 소스 26가지

'LANGUAGE > Java Script' 카테고리의 다른 글

티스토리툴바