'JavaScript'에 해당되는 글 65건

  1. 2009.10.20 .Net Framework 버젼 확인용 JavaScript (2)
  2. 2009.06.22 JavaScript의 KeyEvent에 따른 keycode (9)
  3. 2008.11.10 50가지의 Ajax 예제
  4. 2008.05.13 Image Preview IE7 (3)
  5. 2008.05.06 How well do you know prototype
  6. 2008.04.23 60 More AJAX- and Javascript Solutions For Professional Coding
  7. 2008.04.04 Prototype 1.5.0 커닝 페이퍼
  8. 2008.03.25 태그,스크립트,스타일,주석,한글 제거 정규식 표현
  9. 2008.02.21 IE 인쇄시 설정버튼 제어
  10. 2008.02.11 자바스크립트 Trim 최적화
  11. 2008.02.04 Override window.alert()
  12. 2008.01.22 태그명 알아내기
  13. 2007.08.02 JavaScript Submit Function
  14. 2007.07.04 다른 도메인간 부모창과 자식창 제어 (2)
  15. 2007.06.28 팝업창 스크롤바 자동 생성
  16. 2007.06.22 자바스크립트 라이브러리의 종류와 특징
  17. 2007.05.27 텍스트파일 내용을 테이블로 불러오기
  18. 2007.05.25 5가지 시계 표기 법
  19. 2007.05.25 한줄로 끝내는 롤오버마우스 스크립트
  20. 2007.05.25 랜덤 이미지 출력
  21. 2007.05.25 체크 박스 클릭하면 하루동안 팝업창 안 열리게 하기
  22. 2007.05.25 자바스크립트로 마우스 휠 제어하기
  23. 2007.05.25 텍스트영역 리사이즈 컴포넌트
  24. 2007.05.21 30 Scripts For Galleries, Slideshows and Lightboxes
  25. 2007.05.12 TinyMCE Javascript HTML WYSIWYG editor
  26. 2007.05.03 파이어버그의 콘솔을 이용한 자바스크립트 트레이스
  27. 2007.05.03 JS, CSS파일 압축전송으로 페이지 로딩속도 향상
  28. 2007.05.03 JavaScript Object Table
  29. 2007.05.03 문서 內 모든 링크의 아래점선 없애기
  30. 2007.05.03 윈도 크기에 따라 글자크기 변경
크리에이티브 커먼즈 라이선스
Creative Commons License
<html>
	<head>
	<script language="javascript">
		function dotnet() {
			var ag = navigator.userAgent;
			if (ag.indexOf("IE")!=-1) {
				if (ag.indexOf("NET CLR") != -1) {
					if (ag.indexOf("NET CLR 1.0")!= -1) {
						document.write(".net Framework version 1.0 found.<br/>");
					}
					if (ag.indexOf("NET CLR 1.1")!= -1) {
						document.write(".net Framework Version 1.1 found.<br/>");
					}
					if (ag.indexOf("NET CLR 2")!= -1) {
						document.write(".net Framework Version 2 found.<br/>");
					}
				} else {
					document.write("No .net Framework found.<br/>Please install the .net Framework.");
				}
			} else {
				document.write("The automatic detection of the .net framework only works in Internet Explorer.");
			}
		}
	</script>
	</head>
	<body>
		<div style="background-color: FFCC00; border-width: 1; border-style: solid; border-color: 000000; 
	width: 800px; padding: 4px; line-height: 14px;">
			.net Framework Status
		</div>
		<div style="border-width: 0px 1px 1px 1px; border-style: solid; border-color: 000000; width: 800px; 
	padding: 4px;">
			<script language="javascript">dotnet();</script>
		</div>
	</body>
</html>


출처 : http://www.codeschmiede.net/dotnettester_en.html


신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
event.keyCode의 값은 key event에 따라 그 값이 변한다.
'흔히 알고 있는 keyCode 값'은 onKeyDown 이나 onKeyUp Event 를 통해 추출할 수 있는 값들이고,
이 외에 onKeyPress 를 이용했을 경우에는 keyCode값이 달라진다.

사용예 : onKeyPress="if (event.keyCode==45) event.returnValue=false;"

key
press
key
down
key
up
Esc27(IE만)2727
F1-112-
F2-113113
F3-114114
F4-115115
F5-116116
F6-117-
F7-118118
F8-119119
F9-120120
F10-121121
F11-122122
F12-123123
key
press
key
down
key
up
0484848
1494949
2505050
3515151
4525252
5535353
6545454
7555555
8565656
9575757
key
press
key
down
key
up
~126192192
!334949
@645050
#355151
$365252
%375353
^945454
&385555
*425656
(405757
)414848
_95189189
+43187187
|124220220
`96192192
-45189189
=61187187
\92220220
{123219219
[91219219
}125221221
]93221221
:58186186
;59186186
"34222222
'39222222
<60188188
>62190190
?63191191
,44188188
.46190190
/47191191
key
press
key
down
key
up
PrintScreen--44
(IE외)
ScrollLock-145145
Pause-1919
BackSpace-88
Tab-9-
CapsLock-2020
Enter131313
Shift-1616
Left Ctrl-1717
Left
WindowMenu
-9191
Left Alt-1818
한자-25-
SpaceBar323232
한/영-229-
Right Alt-22921
Right
WindowMenu
-9292
Context Menu-9393
Right Ctrl-2525
Insert-4545
Home-3636
PageUp-3333
Delete-4646
End-3535
PageDown-3434
NumLock-144144
key
press
key
down
key
up
Up(↑)-3838
Left(←)-3737
Down(↓)-4040
Right(→)-3939
NumPadkey
press
key
down
key
up
/47111111
*42106106
-45109109
755103103
856104104
957105105
+43107107
452100100
553101101
654102102
1499797
2509898
3519999
0489696
.46110110
Enter131313
Home-3636
Up(↑)-3838
PageUp-3333
Left(←)-3737
Clear-1212
Right(→)-3939
End-3535
Down(↓)-4040
PageDown-3434
Insert-4545
Delete-4646
key
press
key
down
key
up
a976565
A656565
b986666
B666666
c996767
C676767
d1006868
D686868
e1016969
E696969
f1027070
F707070
g1037171
G717171
h1047272
H727272
i1057373
I737373
j1067474
J747474
k1077575
K757575
l1087676
L767676
m1097777
M777777
n1107878
N787878
o1117979
O797979
p1128080
P808080
q1138181
Q818181
r1148282
R828282
s1158383
S838383
t1168484
T848484
u1178585
U858585
v1188686
V868686
w1198787
W878787
x1208888
X888888
y1218989
Y898989
z1229090
Z909090


신고

'Developer > JavaScript' 카테고리의 다른 글

JavaScript의 KeyEvent에 따른 keycode  (9) 2009.06.22
50가지의 Ajax 예제  (0) 2008.11.10
ASCII Character Codes Table & Cheat Sheet  (0) 2008.10.20
Prototype 1.6.0 rc0 Map  (0) 2008.05.30
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

Ajax Forms

ShoutBox

Ajax 메신저

Ajax 탭 컨텐트

Ajax 별점 매기기

Ajax 인라인 에디트

Ajax 프로그레스 바

Ajax 페이징

Ajax 파일 업로드

Ajax 자동완성

웹에디터

투표

테이블 데이터 관리

기타


출처 : http://ajaxian.com/archives/groups-of-50-ajax-examples


신고

'Developer > JavaScript' 카테고리의 다른 글

JavaScript의 KeyEvent에 따른 keycode  (9) 2009.06.22
50가지의 Ajax 예제  (0) 2008.11.10
ASCII Character Codes Table & Cheat Sheet  (0) 2008.10.20
Prototype 1.6.0 rc0 Map  (0) 2008.05.30
Posted by marga

Image Preview IE7

Developer 2008.05.13 09:19
크리에이티브 커먼즈 라이선스
Creative Commons License
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=euc-kr" />
    <style type="text/css">
        #previewPhoto {
            width:100%;
            height:100%;
            position:absolute;
            z-index:1;
            filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='noPhoto.gif',sizingMethod=scale);
        }
        #previewPhotoTemp {
            width:115px;
            height:150px;
        }
    </style>
    <script type="text/JavaScript">
    <!--
        function showPhoto(src) {
            if(src.match(/\.(gif|jpg|jpeg)$/i)) {
                var obj = document.getElementById("previewPhotoTemp");
                obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod=image)";
                var w = obj.offsetWidth;
                var h = obj.offsetHeight;
                if(w > 115) { //image resize
                    var x_axis = w / 115;
                    var y_axis = parseInt(h / x_axis);
                }
                else { var y_axis = h; }

                //size setting
                document.getElementById("previewPhotoBox").style.width = '115px';
                document.getElementById("previewPhotoBox").style.height = y_axis + 'px';

                //image setting
                document.getElementById("previewPhoto").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod=scale)";
                document.getElementById("verifyPhoto").value = "Y";
            }
            else {
                alert("gif, jpg, jpeg 형식의 파일만 첨부 가능 합니다.");
                document.getElementById("verifyPhoto").value = "";
            }
        }
        function killPhoto() {
            if(!confirm("사진을 취소하시겠습니까?")) return;
            document.getElementById("filePhoto").outerHTML = document.getElementById("filePhoto").outerHTML;
            document.getElementById("verifyPhoto").value = "";
            document.getElementById("previewPhoto").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='noPhoto.gif',sizingMethod=scale)";
        }
    //-->
    </script>
</head>
<body>
    <!-- Thumbnail Crop -->
    <div style="overflow: hidden; width: 115px; height: 150px;">
        <!-- Thumbnail Container -->
        <div id="previewPhotoBox" style="width: 115px; height: 150px;">
            <!-- Thumbnail -->
            <div id="previewPhoto">
            </div>
        </div>
    </div>
    <div style="overflow: hidden; width: 1px; height: 1px;">
        <div id="previewPhotoTemp">
        </div>
    </div>
    <!--marga:verifyPhoto 값이 Y 일 때만 첨부파일 저장 로직을 실행 하세요-->
    <input type="hidden" id="verifyPhoto" />
    <input type="file" name="filePhoto" id="filePhoto" onchange="JavaScript:showPhoto(this.value);" />
    <input type="button" value="사진취소" onclick="JavaScript:killPhoto();" />
</body>
</html>
신고

'Developer' 카테고리의 다른 글

Regular Expressions Cheat Sheet  (2) 2009.07.02
Image Preview IE7  (3) 2008.05.13
정규표현  (0) 2008.01.29
14 Tab-Based Interface Techniques  (0) 2007.04.18
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
Prototype 은 우리에게 보다 빠르고 현명하게(?) JavaScript를 사용할 수 있도록 도와준다.
하지만, 익숙치 않을때는 훌륭한 Framework의 기능을 충분히 끌어내지 못하는 경우가 많다.

이를 상기 시키기 위한 지침 'How well do you know prototype' 가 있다.
Prototype 초보 사용자 들에겐 유익한 포스트라 할 수 있겠다.

How well do you know prototype (part I)

How well do you know prototype (part II)
//바르지 못한 방법:
document.getElementById("foo ")
//적당한 방법: 놀랍게도 어떤 사람들은 이것에 대해 잘 모른다.
$("foo ")

//바르지 못한 방법:
var woot = document.getElementById("bar").value
var woot = $("bar").value
//적당한 방법: 폼 값의 편리하고 빠른 호출
var woot = $F("bar")

//바르지 못한 방법:
$('footer').style.height = '100px';
$('footer').style.background = '#ffc';
//적당한 방법: 모든 브라우저가 W3C의 권고를 따르고 있지 않다.
$('footer').setStyle({
height: '100px',
background: '#ffc'
})

//바르지 못한 방법:
$('coolestWidgetEver').innerHTML = 'some nifty content'
//적당한 방법:
$('coolestWidgetEver').update('some nifty content')
// 아래와 같은 문법 구사가 가능해 지므로
$('coolestWidgetEver').update('some nifty content').addClassName('highlight').next().hide()

//바르지 못한 방법:
new Ajax.Request('ninja.php?weapon1=foo&weapon2=bar')
//적당한 방법: 보기 좋으며 보다 나은 파라메터 구조 사용
new Ajax.Request('ninja.php', {
parameters: {
weapon1: 'foo',
weapon2: 'bar'
}
})

//바르지 못한 방법:
new Ajax.Request('blah.php', {
method: 'POST',
asynchronous: true,
contentType: 'application/x-www-form-urlencoded',
encoding: 'UTF-8',
})
//적당한 방법: 기본옵션은 생략하라!
new Ajax.Request('blah.php')

//바르지 못한 방법:
Event.observe('myContainer', 'click', doSomeMagic)
//적당한 방법: 논쟁의 여지가 있지만 객체지향적이다!
$('myContainer').observe('click', doSomeMagic)

//바르지 못한 방법:
$$('div.hidden').each(function(el){
el.show();
})
//적당한 방법: 슬프게도 이 사용법을 아는 사람들이 많지 않다는 사실.
$$('div.hidden').invoke('show')

//바르지 못한 방법:
$$('div.collapsed').each(function(el){
el.observe('click', expand);
})
//적당한 방법: invoke를 이용한 이벤트 핸들링, 졸라 쉽다!
$$('div.collapsed').invoke('observe', 'click', expand)

//바르지 못한 방법:
$$('input.date').invoke('observe', 'focus', onFocus);
$$('input.date').invoke('observe', 'blur', onBlur);
//적당한 방법: $$는 오버해드가 크기 때문에 invoke를 사용하면 $$를 여러번 사용할 필요도 없다.
$$('input.date').invoke('observe', 'focus', onFocus).invoke('observe', 'blur', onBlur)

//바르지 못한 방법:
$('productTable').innerHTML =
$('productTable').innerHTML +
'<tr><td>' + productId + ' '
+ productName + '</td></tr><tr><td>'
+ productId + ' ' + productPrice +
'</td></tr>'
//적당한 방법: Template 클래스는 정말 쓸만한 DOM 솔루션이다. 하지만 잘 사용되고 있지 않는 것 같다.
var rowTemplate = new Template('<tr><td>#{id} #{name}</td></tr><tr><td>#{id} #{price}</td></tr>');
$('productTable').insert(
rowTemplate.evaluate({
id: productId,
name: productName,
price: productPrice
}))
)
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License


http://www.smashingmagazine.com/2008/04/15/60-more-ajax-and-javascript-solutions-for-professional-coding/


When it comes to design of modern web-applications, Ajax is considered as a standard approach. Interactive solutions for lightboxes, form validation, navigation, search, tooltips and tables are developed using Ajax libraries and nifty Ajax scripts. Ajax is useful and powerful. However, when using Ajax, one should keep in mind its drawbacks in terms of usability and accessibility. With an extensive use of Ajax, you can easily confuse your visitors offering too much control and too many features.

Nevertheless, it’s important to know what’s possible, particularly since you can develop new ideas further, improving the quality of your web applications. Since our last article 80+ AJAX-Solutions For Professional Coding many things have changed — new scripts were introduced, new creative solutions were developed, new robust development kits have been released. They all are supposed to serve a better user experience and provide more comfort for web-developers.

This post presents over 60 new useful Ajax scripts, libraries and solutions which you can use in your future projects. License agreements can change from time to time — please read them carefully before using the script in a commercial web-application.

You might want to consider checking out the following related posts:

Please notice: the overview presented below is not just a yet-another-one-collection of Ajax-scripts. It’s a collection of really useful ones, the ones you can use in almost every project you’ll be working on.



신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
사용자 삽입 이미지

원본 이미지를 좀 더 선명하게 수정했다.

원본 이미지는 좀 연해서 보고 있으면 눈이 뿌해진다.. =_=;;

프린터 출력은 '커닝페이퍼 PDF 파일' 로 하는 것이 깔끔하다.

관련 내용은 '여기' 를 참조..
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

var str = "한글 <!-- 주석 --> <script type="text/javascript">window.alert('hellow')<\/script>";
 str += "<style type='text/css> td {font-size:9pt;}<\/style>";
 str += "<br /> <h3>Hellow Blog</h3>";


//태그제거
var RegExpTag = "<[^<|>]*>";
str = str.replace(RegExpTag,"");
//result : 한글 window.a lert('hellow'); td {font-size:9pt;} Hellow Blog


//스크립트 제거
var RegExpJS = "<script[^>]*>(.*?)</script>";
str = str.replace(RegExpJS,"");
//result : 한글 <!-- 주석 -->  <br> <h3>Hellow Blog</h3>


//스타일 제거
var RegExpCSS = "<style[^>]*>(.*?)";
str = str.replace(RegExpCSS,"");
//result : 한글 <!-- 주석 --> <script type="text/javascript">window.a lert('hellow');</script><br></style[^><h3>Hellow Blog</h3>


//한글 제거
var RegExpHG = "[ㄱ-ㅎ가-힣]";
str = str.replace(RegExpHG,"");
//result : <!-- 주석 --> <script type="text/javascript">window.a lert('hellow');</script><br><h3>Hellow Blog</h3>


//주석 제거
var RegExpDS = /<!--[^>](.*?)-->/g;
str6 = str.replace(RegExpDS,"");
//result : 한글 <script type="text/javascript">window.a lert('hellow');</script><br><h3>Hellow Blog</h3>


출처 : http://blueb.net/blog/1174
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=euc-kr">
    <script language="javascript">
        function ieExecWB( intOLEcmd, intOLEparam ) {
            //참고로 IE 5.5 이상에서만 동작함

            // 웹 브라우저 컨트롤 생성
            var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';

            // 웹 페이지에 객체 삽입
            document.body.insertAdjacentHTML('beforeEnd', WebBrowser);

            // if intOLEparam이 정의되어 있지 않으면 디폴트 값 설정
            if ( ( ! intOLEparam ) || ( intOLEparam < -1 ) || (intOLEparam > 1 ) )
                intOLEparam = 1;

            // ExexWB 메쏘드 실행
            WebBrowser1.ExecWB( intOLEcmd, intOLEparam );

            // 객체 해제
            WebBrowser1.outerHTML = "";
        }
    </script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
    <input type=button value="인쇄 미리 보기" onclick="window.ieExecWB(7)">
    <input type=button value="페이지 설정" onclick="window.ieExecWB(8)">
    <input type=button value="인쇄하기(대화상자 표시)" onclick="window.ieExecWB(6)">
    <input type=button value="인쇄 바로 하기" onclick="window.ieExecWB(6, -1)">
</body>
</html>
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
function trim11 (str) {
    str = str.replace(/^\s+/, '');
    for (var i = str.length - 1; i > 0; i--) {
        if (/\S/.test(str.charAt(i))) {
            str = str.substring(0, i + 1);
            break;
        }
    }
    return str;
}
출처 : http://firejune.com/1280
신고

'Developer > JavaScript' 카테고리의 다른 글

IE 인쇄시 설정버튼 제어  (0) 2008.02.21
자바스크립트 Trim 최적화  (0) 2008.02.11
Override window.alert()  (0) 2008.02.04
태그명 알아내기  (0) 2008.01.22
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
자바스크립트 함수 중 alert 이라는 함수를 override 하여 system modal window 가 아닌 layer 디자인을 통해 alert window를 만들어 사용할 수 있습니다. (window.confirm 도 바꿀 수 있겠죠.. ㅎㅎ )


 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 <html xmlns="http://www.w3.org/1999/xhtml"> 
 <head> 
 <title> Override Alert </title> 
 </head> 
 <body> 
 <script type='text/javascript'> 
 /***
  * Description : override alert
  * Author : blueb(xblueb@gmail.com)
  * Date : 2008-02-04
  */
     window['alert'] = function(msg){    
         if( document.getElementById("alert") == null ){ 
             var cw = parseInt(document.documentElement.clientWidth); 
             var ch = parseInt(document.documentElement.clientHeight); 
  
             var _top = ch/2 - 50; 
             var _left = cw/2 - 150; 
  
              var div = document.createElement('div'); 
              div.id = "alert"; 
              div.style.width = "300px"; 
              div.style.height = "100px"; 
              div.style.border = "5px solid #000"; 
              div.style.fontSize = "9pt"; 
              div.style.zIndex = "100"; 
              div.style.position = "absolute"; 
              div.style.top = _top +"px"; 
              div.style.left = _left +"px"; 
              var layout = "<div style="text-align: center; margin-top: 20px; position: relative;" id="alert-msg">" + msg + "</div>"; 
              layout += "<div style="text-align: center; margin-top: 10px; bottom: 10px; position: absolute; width: 100%;"><a href="%5C%22javascript:void%28document.getElementById%28%27alert%27%29.style.display=%27none%27%29%5C%22">[close]</a></div>"; 
              div.innerHTML = layout; 
              document.body.appendChild(div); 
  
         }else{ 
             var cw = parseInt(document.documentElement.clientWidth); 
             var ch = parseInt(document.documentElement.clientHeight); 
  
             var _top = ch/2 - 50; 
             var _left = cw/2 - 150; 
  
              var div = document.getElementById("alert"); 
              div.style.top = _top +"px"; 
              div.style.left = _left +"px"; 
  
             document.getElementById("alert-msg").innerHTML = msg; 
             document.getElementById("alert").style.display = ""; 
         }
     }; 
 </script> 
 <a href="javascript:window.alert('Hello world')">click</a> 
 </body> 
 </html> 


system alert 과 같은 형태의 효과를 내기 위해서는 몇가지 더 추가 되어야 할 사항들이 있습니다. alert window가 발생된 시점에 content의 모든 영역에 click을 방지 하기 위해 투명 layer로 차단해줘야 겠죠 그외에도 몇가지 더 추가 해야 할 거 같습니다.


신고

'Developer > JavaScript' 카테고리의 다른 글

자바스크립트 Trim 최적화  (0) 2008.02.11
Override window.alert()  (0) 2008.02.04
태그명 알아내기  (0) 2008.01.22
JavaScript Submit Function  (0) 2007.08.02
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
document.getElementsByTagName

.....내 머리는 붕어


-Tag Count
document.getElementsByTagName("태그명").length

-Tag Item Value
document.getElementsByTagName("태그명").item(0).value

-Tag Item Focus
document.getElementsByTagName("태그명").item(0).focus();

.....내 머리속의 붕어
.....망할....OTL;;
신고

'Developer > JavaScript' 카테고리의 다른 글

Override window.alert()  (0) 2008.02.04
태그명 알아내기  (0) 2008.01.22
JavaScript Submit Function  (0) 2007.08.02
다른 도메인간 부모창과 자식창 제어  (2) 2007.07.04
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

/**
 * common function for search and submit.
 *
 * frm: ex) document.getElementById("[form id]");
 * url: target url. ex) my_list.jsp
 * method: "get" or "post". default is "get".
 *
 * goto(document.getElementById('frm'), 'my_list.jsp', 'get', 'ifr_content');
 */
function goto(frm, url, method, target) {
    if (method != "get" && method != "post") {
        method = "get";
    }
    if (target == null || target == "undifined" || target.length == 0) {
        target = "_self";
    }
    
    frm.action = url;
    frm.method = method;
    frm.target = target
    frm.submit();
}

재밌는 함수로군... 훗..

신고

'Developer > JavaScript' 카테고리의 다른 글

태그명 알아내기  (0) 2008.01.22
JavaScript Submit Function  (0) 2007.08.02
다른 도메인간 부모창과 자식창 제어  (2) 2007.07.04
팝업창 스크롤바 자동 생성  (0) 2007.06.28
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

익스플로러 5.5(?) 이후 부터는 스크립트로 server1.abc.com 과 live.abc.com 간의 상호 도메인이 다른 프레임이나 윈도우의 document에 관련된 작업을 시도하면 보안에러가 발생한다.

Cross-Frame Scripting 에 대한 MS의 말..
http://msdn2.microsoft.com/en-us/library/ms533028.aspx

넷스케이프 같은 경우에는 스크립트(Signed scripts)에서 브라우져자체에 포함(?)된 클래스(netscape.security.PrivilegeManager)를 호출하여 이를 해결할 수 있다고 한다.

Signed Scripts 에 대한 Mozilla의 말..
http://www.mozilla.org/projects/security/components/signed-scripts.html

그럼에도 불구하고 다른 도메인에 대한 opener 나 parent 접근이 필요할 경우에는 JavaScript 를 통해 document.domain 을 설정해 주면된다.
<script language="javascript">
    document.domain = "공통도메인명";
</script>
상호 연결 시켜야 하는 웹 페이지에 자신들의 공통된 도메인을 지정해 주면 컨트롤이 가능해진다.

만약, server1.abc.com의 open.htm이 window.open 으로 live.abc.com을 호출하고 live.abe.com 의 child.htm이 opener 로 server1.abc.com 을 접근해야 한다면
다음 스크립트를 두 페이지에 정의해 주면 되고, 스크립트는 페이지 어디에 위치해 있든지 특별한 상관은 없다.

<script language="javascript">
    document.domain = "abc.com";
</script>

※ 주의, 도메인 명을 잘못 입력한 경우에는 "잘못된 인수입니다." 라는 JavaScript 오류가 발생한다.

=========================================================================================
cross frame scripting 을 해결하는 다른 방법으로는 HTA가 있다.
html페이지가 아닌 hta(html application)페이지를 만들어야 한다.

http://msdn.microsoft.com/workshop/author/hta/hta_node_entry.asp

※ 다음은 HTA에서 javascript로 iframe의 document를 참조한 예

확장자를 hta로 저장하시고 브라우저로 실행.

<html>
<head>
  <title>hta cross scripting</title>
  <script>
    function window.onload() {
       alert(myframe.document);
    }
  </script>
</head>
<body scroll="no">
  <iframe id=myframe src="http://kin.naver.com/"></iframe>
</body>
</html>

다음에, 예를 하나 들면..
kin.naver.com을 iframe에 넣고 검색어에 "스크립트"라는 단어를 넣은 후 검색버튼을 누르게 한 HTA소스이다.

<html>
<head>
  <title>hta cross scripting</title>
  <script>
    function window.onload() {
       myframe.document.search.query.value="스크립트";
       myframe.check_query();
    }
  </script>
</head>
<body scroll="no">
  <iframe id=myframe src="http://kin.naver.com/" width=100% height=100%></iframe>
</body>
</html>


 

신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<html>
<head><title></title>
<script type='text/javascript'>
window.onload = function(){
       if( (parseInt(document.getElementById('body').offsetHeight)- parseInt(window.document.body.clientHeight)) > 20 ) {
            window.document.body.scroll = "auto";
            window.resizeBy(18,0);
        }

    }
</script>
<body>
<div id='body'>
팝업 내용
</div>
</body>
</html>

부모창에서 팝업창을 띄울시 스크롤바 옵션 `scrollbars=no`  일때 팝업창의 내용이 길어질 경우 스크롤바롤 생성해주는 스크립트이다.
덧, 이 스크립트는 세로길이에 대한 스크롤바만 생성하도록 한 것이다.


페이지가 로드되면 div 의 세로 길이와 창의 크기를 측정하여 20px 이상일 경우 스크롤바를 생성 이때 가로 길이 18px(스크롤바 사이즈)을 넓여 준다.

출처 : http://blueb.net/blog/887
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
Fire June 님이 웹어플리케이션 컨퍼런스 2007에서 발표한 JavaScript Library 의 종류와 특징이라는 주제의 발표 자료다.
Ajax를 사용하기 위해서는 JavaScript Library 거의 필수가 되버린 상황에 여러 Library 중 무엇을 써야 하는가를 선택하는 것은 성능과 직결되는 문제.
프리젠테이션 발표자료 인지라 대표적 Library 들을 간략하게 설명하고 있지만, 주옥같은 자료라고 할 수있다.. ㅜ_ㅜ)b


위 파워포인트 자료에는 각 라이브러리 배포사이트의 스크린샷에 링크가 있으며, 슬라이드 노트에 발표내용을 포함하고 있다.

원문 : http://firejune.com/1109
신고

'Developer > JavaScript' 카테고리의 다른 글

팝업창 스크롤바 자동 생성  (0) 2007.06.28
자바스크립트 라이브러리의 종류와 특징  (0) 2007.06.22
웹표준에 맞는 form 코딩법  (0) 2007.05.25
5가지 시계 표기 법  (0) 2007.05.25
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
지금 소개하는 방법은 서버에 txt파일을 CGI프로그램의 도움이 없이도 항상 동적으로 불러서 화면에 출력해주는 Active X의 활용방법입니다. 즉, 웹서버측에 다음과 같은 table_list.txt 파일이 있고, 이를 자동으로 테이블로 구성하여 보여줍니다.

table_list.txt 파일의 구성내용은 아래와 같습니다.
no,성별,이름,나이,주소,전화번호
1,남,홍길동,30,광주광역시 동구,062-444-1111
2,여,유관순,32,전라남도 여수시,061-777-7777
3,남,이순신,45,서울특별시 강남구,02-111-0000
4,여,심청이,23,서울특별시 동작구,011-600-0000
5,남,심봉사,55,경상남도 마산시,016-555-0000
6,남,대통령,77,강원도 춘천시,011-000-0000

NO. 성별 이름 나이 주소 전화번호
1
홍길동
30
광주광역시 동구
062-444-1111
2
유관순
32
전라남도 여수시
061-777-7777
3
이순신
45
서울특별시 강남구
02-111-0000
4
심청이
23
서울특별시 동작구
011-600-0000
5
심봉사
55
경상남도 마산시
016-555-0000
6
대통령
77
강원도 춘천시
011-000-0000

<object classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83" width="1" height="1" id="clist" border="0">
<param name="DataURL" value="/SRC/javascript/table_list.txt">
<param name="UseHeader" value="True">
</object>

<center>
<table border=0 cellpadding=3 width=450 cellspacing=1 bgcolor=999999 datasrc="#clist">
<THEAD>
   <tr align=center bgcolor=efefef>
     <td><b>NO.</b></td>
     <td><b>성별</b></td>
     <td><b>이름</b></td>
     <td><b>나이</b></td>
     <td><b>주소</b></td>
     <td><b>전화번호</b></td>
   </tr>
</THEAD>
<TBODY>
   <tr bgcolor=white align=center>
     <td><DIV DATAFLD="no"></DIV></td>
     <td><DIV DATAFLD="성별"></DIV></td>
     <td><DIV DATAFLD="이름"></DIV></td>
     <td><DIV DATAFLD="나이"></DIV></td>
     <td><DIV DATAFLD="주소"></DIV></td>
     <td><DIV DATAFLD="전화번호"></DIV></td>
   </tr>
</TBODY>
</table>

신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<HTML> 
<HEAD> 
<TITLE> JASKO Sample<span class="key1" onclick="keyword_open('/kview.php?kd=+Script')"> Script</span> </TITLE> 

<SCRIPT LANGUAGE="JavaScript"> 
<!-- 

window.status="로딩중..." 

function timeNow() 
{ 
now = new Date() 
var hours = now.getHours() 
var minutes = now.getMinutes() 
var seconds = now.getSeconds() 
var ap = "오전" 
  if (hours > 12) 
      {var ap = "오후" , hours = hours-12 ;} 
  if (minutes < 10) 
      {minutes = "0"+minutes} 
  if (seconds < 10) 
      {seconds = "0"+seconds} 

/********************** 상태바 시계 *******************/ 
window.status = hours+":"+minutes+":"+seconds+" "+ap 
/********************** 상태바 시계 *******************/ 

/********************* 텍스트 상자 시계 ************************/ 
document.time.clock.value = hours+":"+minutes+":"+seconds+" "+ap 
document.time.clock.size = document.time.clock.value.length 
/********************* <span class="key1" onclick="keyword_open('/kview.php?kd=%ED%85%8D%EC%8A%A4%ED%8A%B8+')">텍스트 </span>상자 시계 ************************/ 

/************************* 버튼 시계 *****************************/ 
document.time.butclock.value = hours+":"+minutes+":"+seconds+" "+ap 
/************************* 버튼 시계 *****************************/ 

/********************* 타이틀 바 시계 ***************/ 
document.title = hours+":"+minutes+":"+seconds+" "+ap 
/********************* 타이틀 바 시계 ***************/ 

setTimeout("timeNow()",1000) 

} 

function timeAlert() 
{ 
now = new Date() 
var hours = now.getHours() 
var minutes = now.getMinutes() 
var seconds = now.getSeconds() 
var ap = "오전" 

  if (hours > 12) 
      {var ap = "오후" , hours = hours-12 ;} 
  if (minutes < 10) 
      {minutes = "0"+minutes} 
  if (seconds < 10) 
      {seconds = "0"+seconds} 
alert(hours+":"+minutes+":"+seconds+" "+ap) 
} 

// --> 
</SCRIPT> 

</head> 

<body onLoad="timeNow()"> 
<CENTER><H3>다섯가지 시계표기법</H3></CENTER> 

<p align=center> 
<form name=time> 
<input name=clock size=10 value="로딩 중입니다..."> 
<input type=button name=butclock value="로딩 중입니다..."> 
<input type=button name=showTime value=" 시계 보기 " onClick="timeAlert()"> 

</form> 

<TABLE width=50% align=center bgcolor=teal> 
<TR> 
<TD bgcolor=ivory> 
<LI>1번째 : 제목표시줄 
<LI>2번째 : 상태표시줄 
<LI>3번째 : 텍스트상자 
<LI>4번째 : 버튼 
<LI>5번째 : 버튼클릭후 팝업 

</TD> 
</TR> 
</TABLE> 
</body> 
</html> 
신고

'Developer > JavaScript' 카테고리의 다른 글

웹표준에 맞는 form 코딩법  (0) 2007.05.25
5가지 시계 표기 법  (0) 2007.05.25
한줄로 끝내는 롤오버마우스 스크립트  (0) 2007.05.25
랜덤 이미지 출력  (0) 2007.05.25
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<a href='#' onmouseover='Image01.src="바뀔이미지명"' onmouseout='Image01.src="원래이미지명"'>
<img src='원래이미지명' name='Image01'>
</a>


<script>~</script>
같은건 필요없습니다.


아래같은 형태로도 가능합니다.
<table> 
<tr>
    <td background="원래이미지" onmouseenter="Image01.style.visibility='visible';"
onmouseleave="Image01.style.visibility='hidden';">
    <img id="Image01" src="바뀔이미지" style="visibility:hidden;">
   </td>
</tr>
</table>
출처 : http://firejune.com/94&ct1=8&ct2=42
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<script> 
// 2개의 이미지 경로
var images = new Array("./images/my1.gif","./images/sea.gif",);

// 추가한 수만큼 고침
var index = Math.round(Math.random * 2);

document.write("<img width=130 name='image" + i + "' src='" + images [i] + "'></img>");
</script>
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
출처 : http://firejune.com/98&ct1=8&ct2=42

아래의 소스를 새창을 띄울 부모문서의 <head></head>사이에 넣어 주세요 

<SCRIPT LANGUAGE="JavaScript">
<!--
function getCookie( name ){
var nameOfCookie = name + "=";
var x = 0;
while ( x <= document.cookie.length )
{
var y = (x+nameOfCookie.length);
if ( document.cookie.substring( x, y ) == nameOfCookie ) {
if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 )
endOfCookie = document.cookie.length;
return unescape( document.cookie.substring( y, endOfCookie ) );
}
x = document.cookie.indexOf( " ", x ) + 1;
if ( x == 0 )
break;
}
return "";
}

//폼의 체크 박스를 체그 하면 새창이 나타나지 않으며, 체크 하지 않았을 경우, 계속 나타납니다.

if ( getCookie( "Notice" ) != "done" ) {
//새창으로 열릴 페이지의 경로 및 크기와 위치를 지정해 주세요.
noticeWindow  =  window.open('http://www.wowman.org','notice','left=0, top=0, width="30"0,height=200');
noticeWindow.opener = self; }

// -->
</SCRIPT>




아래의 소스를 새창으로 열릴 문서의 <head>와</head> <span class="key1" onclick="keyword_open('/kview.php?kd=%ED%83%9C%EA%B7%B8+')">태그 </span>사이에 넣어주세요

<SCRIPT language="JavaScript">
<!--
function setCookie( name, value, expiredays )
{
var todayDate = new Date();
todayDate.setDate( todayDate.getDate() + expiredays );
document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

function closeWin()
{
if ( document.pop.Notice.checked )
setCookie( "Notice", "done" , 1);//1은 하루동안 새창을 열지 않게 합니다.
window.close();
}
// -->
</SCRIPT>


아래의 소스를 새창으로 새창으로 열릴 문서의  <body>와</body><span class="key1" onclick="keyword_open('/kview.php?kd=%ED%83%9C%EA%B7%B8+')">태그 </span>사이에 넣어주세요



<form name=pop>
<p align="center">
<input type=checkbox name="Notice" value="">다음부터 공지창 띄우지 않음<a href="javascript:history.onclick=closeWin()">[닫기]</a>  
</form>
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
최근 Ajax의 활용범위가 확대되면서 슬라이더, 드래그앤 드롭, 소테이블, 백그라운드 업로더, 드래그 선택영역, 오토 컴플리케이션 등 부수적인 웹 인터페이스가 자바스크립트로 속속들이 구현되고 있다. 마우스 버튼은 물론 키보드까지 DHTML로 제어하는 이 시점에서 마우스 인풋없는 웹서핑은 상상조차 할 수 없게 되었다. 이러한 가운데 Adomas Paltanavicius자바스크립트를 이용하여 휠을 제어하는 자바스크립트 코드까지 공개하였다. IE와 파이어폭스 등의 브라우저에서 작동하며 테스트 페이지에서 작동하는 모습을 확인할 수 있다.(뭔가 재미있는 생각이 떠오르지 않는가?)

/* This is high-level function.  */
function handle(delta) {
   var s = delta + ": ";
   if (delta < 0)  s += "down";
   else s += "up";
   document.getElementById('delta').innerHTML = s;
}

/* Event handler for mouse wheel event. */
function wheel(event){
   var delta = 0;
   if (!event) event = window.event;
   if (event.wheelDelta) {
       delta = event.wheelDelta/120;
       if (window.opera) delta = -delta;
   } else if (event.detail) delta = -event.detail/3;
   if (delta) handle(delta);
}

/* Initialization code. */
if (window.addEventListener)
   window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;

출처 : http://firejune.com/922&ct1=8&ct2=42
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
Richard McMahon씨는 Prototype을 이용한 "ResizingTextArea" 컴포넌트를 만들고 공개했다. 이 컴포넌트는 클릭(click)과 키업(keyup)이벤트를 할당하여 텍스트 영역의 Row를 감시하고 실시간으로 리사이즈 한다. 이 블로그의 댓글과 방명록 텍스트 영역에 적용해 보았다.(썩 쓸만함)

/**
* ResizingTextArea Component
* Richard McMahon(http://jroller.com)
*/

var ResizingTextArea = Class.create();
ResizingTextArea.prototype = {
   defaultRows: 1,
   initialize: function(field) {
       this.defaultRows = Math.max(field.rows, 1);
       this.resizeNeeded = this.resizeNeeded.bindAsEventListener(this);
       Event.observe(field, "click", this.resizeNeeded);
       Event.observe(field, "keyup", this.resizeNeeded);
   },
   resizeNeeded: function(event) {
       var t = Event.element(event);
       var lines = t.value.split('\n');
       var newRows = lines.length + 1;
       var oldRows = t.rows;
       for (var i = 0; i < lines.length; i++) {
           var line = lines[i];
           if (line.length >= t.cols) newRows += Math.floor(line.length / t.cols);
       }
       if (newRows > t.rows) t.rows = newRows;
       if (newRows < t.rows) t.rows = Math.max(this.defaultRows, newRows);
   }
}

사용법 : <textarea ... onfocus="new ResizingTextArea(this);">

출처 : http://firejune.com/1026&ct1=8&ct2=42
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

출처 : http://www.smashingmagazine.com/2007/05/18/30-best-solutions-for-image-galleries-slideshows-lightboxes/

Ajax Image Galleries & Lightboxes

CSS-Based Image Galleries

JavaScript + CSS-based Galleries & DHTML-Galleries


신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
Homepage : http://tinymce.moxiecode.com

07.05.08 TinyMCE 2.1.1 Released

TinyMCE Features

TinyMCE API
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

파이어폭스(Firefox)자바스크립트 디버그(debug) 도구인 파이어버그(Firebug)를 이용한 트레이스(trace) 방법을 소개한다. 파이어버그는 훌륭한 디버깅(debugging) 콘솔(console)을 가지고 있다. 간략하게 콘솔에 대해 설명하자면 메시지를 출력하거나 문자열(string)을 출력하는 일 외에도 DOM(Document Object Modal) 객체(object)를 표시할 때에는 어떠한 형태인지 분석하고 분석가능한 경우 DOM에 할당(registered)된 클리커블(clickable)한 객체 목 록을 표시하한다. 만약 엘리먼트(element)라면 'div#IDName.ClassName'과 같이 엘리먼트가 가진 id값, class값 혹은 action, src등 여러정보를 표시하고 클릭시 파이어버그 HTML트리의 해당 노드로 이동시키는 역할까지 하게된다.

파이어버그의 디버깅 콘솔


위 화면은 파이어 버그의 콘솔을 이용해서 트레이스한 예이다. 자바스크립트 코드를 만들면서 지역변수의 값을 실시간으로 확인하거나 산출물에 대한 결과를 리포트할때 사용하면 효과적이다. 지금부터 파이어버그의 콘솔을 활용하는 방법에 대하여 알아보자.
var debug = function(){
  // check browser has console
  if(typeof console != 'undefined' && typeof console.log != 'undefined'){
    console['info'](arguments); // call Firebug's console
  }

출처 : http://firejune.com/1079
}

간 단하게 디버그 함수를 하나 생성했다. console['info'] 함수에 아규먼트(argument)로 넘긴 값이 파이어버그의 콘솔에 표시된다. 콜솔에 표시되는 메시지의 종류로는 'debug', 'info', 'warn', 'error'가 있다. 이것은 좌측 그림과 같이 메시지의 종류를 시각적으로 표시해준다. debug는 값만을 출력하며, info는 메시지 앞 에 파랑색 'i' 아이콘을 붙게되며, warn은 노랑색 'i'아이콘에 라인이 하늘색으로 강조된다. 그리고 error는 빨간색 'x' 아이콘이 붙고 라인이 연노랑색으로 강조된다. 여기서는 트레이스 구분을 위해 일괄적으로 'info'를 사용했다.

자, 이제 위에서 생성한 debug 함수를 활용해보자.
debug('hello world!');
// -> ["hello world!"]
debug(debug, typeof debug);
// -> [function(), "function"]
debug(document.getElementsByTagName('form'));
// -> [[form custom, form#weblog index.php]]
debug('value1', 'value2', 'value3', 'value4', 'value5');
// -> ["value1", "value2", "value3", "value4", "value5"]

파이어버그의 강력한 콘솔기능을 트레이스로 활용함으로써 조금더 편리한 디버깅환경을 구축할수 있다. 이것은 소스를 분석하거나 조작하는데에도 매우 효과적이다. enjoy it.
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

1/2

Niels Leenheer씨는 HTML 페이지의 로드를 가속화하기 위해 포함하는 자바스크립트 및 스타일시트 파일에 gzip을 사용하여 압축하고  모드리라이트(mod_rewrite) 모듈을 이용하여 자동-전송하는 방법을 자신의 개인 블로그에 소개했다. 좌축의 이미지는 파이어버그(firebug)의 Net 콘솔 화면으로 압축전과 압축후의 로딩속도와 파일용량을 비교한 것이다. 압축률은 1: 0.23~0.25 이며, 자료의 크기는 줄지만 완전히 투과하도록 작동하기 때문에 종전의 소스코드에는 변화를 줄 필요가 없다.

파일의 압축전송은 브라우저가 한정된 수만을 동시에 다운로드하므로 몇몇 파일이 완료될때 까지 기다리는 문제가 발생한다. 이 문제의 해결책은 1개의 큰 파일로 결합하여 전송 대역폭을 줄이는 방법을 제공한다. 예를 들자면 아래와 같다.
분리된 자바스크립트 라이브러리 URL :
http://www.firejune.com/javascripts/prototype.js
http://www.firejune.com/javascripts/builder.js
http://www.firejune.com/javascripts/effects.js
http://www.firejune.com/javascripts/dragdrop.js
http://www.firejune.com/javascripts/slider.js

하나로 결합하기 :
http://www.firejune.com/javascripts/prototype.js,builder.js,effects.js,dragdrop.js,slider.js
그리고 웹서버의 리소스 확보를 위해서 파일들의 요청이 있을때마다 압축하는 작업을 거치지않고 캐시를 사용하도록 설정되어 있다.(끌 수 있음) 설치를 시작하기 전에 우선 아래의 주소에서 소스를 다운로드하고 파일명을 'combine.php'로 저장다.

combine.php 다운로드 : http://rakaz.nl/projects/combine/combine.phps

설정을 위해 다운로드한 파일을 열어 자바스크립트, 스타일시트, 캐시 폴더의 경로를 설정한다. 만약 웹서버에 캐시폴더가 없다면 쓸수있는 권한이 있는 폴더를 생성해야한다. 그리고 웹서버의 루트(root)에 업로드 하자. 두번째로 모드리라이트를 손볼 차례이다. 루트의 .htaccess파일을 열어 아래와같은 내용을 삽입하자. 1번과 2번라인은 이미 설정되어 있다면 무시해도 무방하다. 이 또한 마찬가지로 php에서 설정한 자바스크립트가 있는 폴더와 스타일시트가 있는 폴더이름만 변경하면 된다.
RewriteEngine On
RewriteBase /
RewriteRule ^stylesheets/(.*\.css) /combine.php?type=css&files=$1
RewriteRule ^javascripts/(.*\.js) /combine.php?type=javascript&files=$1

다소 간편한 몇가지의 조작만으로 속도향상을 꾀할수 있었다. 자바스크립트와 스타일스트의 양이 많은 곳이라면 꼭한번 써봄직한 솔루션이다.

출처 : http://firejune.com/1080
신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License

Anchor | anchors array | Applet | applets array | Area | Array | Button | Checkbox | Date | document | FileUpload | Form | forms array | frames array | Hidden | History | history array | Image | images array | Layers | layers array | Link | links array | location | Math | MimeType | mimeTypes array | navigator | Number | Option | options array | Password | Plugin | plugins array | Radio | radio array | Reset | screen | Select | String | Submit | Text | Textarea | window


※ 녹색은 네츠케이프, 혹은 익스플로러 전용으로만 사용되는 객체(속성,메소드)입니다

객체(Object)

속성(Property)

메소드(Method)

이벤트핸들러(Event Handler)

Anchor

name
text
x
y



anchors array

length



Applet


applet's methods


applets array

length



Area

hash
host
gostname
href
pathname
port
protocol
search
target


onClick
onmouseOut
onmouseOver

Array

length

concat
join
pop
push

reverse
shift
slice
sort
unshjft


Button

form
name
type
value

blur
click
focus

onClick
onmouseDown
onmouseUp

Checkbox

checked
defaultChecked
form
name
type
value

blur
click
focus

onClick
onmouseDown
onmouseUp

Date


getDate
getDay
getFullYear
getHours
getMilliseconds
getMinutes
getMonth
getSeconds
getTime
getTimezoneOffset
getUTCDate
getUTCDay
getUTCFullYear
getUTCHours
getUTCMilliseconds
getUTCMinutes
getUTCMonth
getUTCSeconds
getYear
parse
setDate
setFullYear
setHours
setMilliseconds
setMinutes
setMonth
setSeconds
setTime
setUTCDate
setUTCHours
setUTCMilliseconds
setUTCMinutes
setUTCMonth
setUTCSeconds
setYear
goGMTString
toLocaleString
toString
toUTCString
UTC
valueOf


document

activeElement
alinkColor
all
Anchor
anchors
Applet
applets
Area
bgColor
body
charset
children

cookie
defaultCharset
domain
embed
embeds
expando

fgColor
Form
forms
Image
images

lastModified
Layer
layers

linkColor
Link
links
location
parentWindow
plugins

readyState
referrer
scripts
selection
styleSheets

title
URL
vlinkColor

clear
close
createElement
createStylesheet
elementFromPoint
getSelection

open
write
writeIn


FileUpload

form
name
type
value

blur
focus

select

onBlur
onFocus
onSelect

Form

action
Button
Checkbox
elements
encoding
FileUpload
Hidden
length
method
name
Password
Radio
Reset
Select
Submit
target
Text
Textarea

reset
submit

onReset
onSubmit

forms array

length



frames array

length



Hidden

form
name
type
value



History

current
length
next
previous

back
foward
go


history array

length



Image

border
complete
height
hspace
lowsrc
name
src
vspace
width
x
y


onAbort
onError
onLoad

images array

length



Layers

above
background
below
bgColor
clip
document
hidden
left
name
pageX
pageY
parentLayer
siblingAbove
siblingBelow
src
top
visibility
window
x
y
zindex

load
moveAbove
moveBelow
moveBy
moveTo
moveToAbsolute
resizeBy
resizeTo

onBlur
onFocus
onmouseOut
onmouseOver
onmouseUp

layers array

length



Link

hash
host
hostname
href
pathname
port
protocol
search
target
text
x
y


onClick
onmouseOut
onmouseOver

links array

length



location

hash
host
hostname
href
pathname
port
protocol
search

reload
replace


Math

E
LN2
LN10
LOG2E
LOG10E
PI
SQRT1_2
SQRT2

abs
acos
asin
atan
atan2
ceil
cos
exp
floor
log
max
min
pow
random
round
sin
sqrt
tan


MimeType

description
enabledPlugin
suffixes
type



mimeTypes array

length



navigator

appCodeName
appMinorVersion
appName
appVersion
browserLanguage
cookieEnabled
cpuClass
languages
mimeTypes

platform
plugins
systemLanguage

userAgent
userLanguage
userProfile

javaEnabled
preference
savePreferences
taintEnabled


Number

MAX_VALUE
MIN_VALUE
NaN
NEGATIVE_INFINITY
POSITIVE_INFINITY

toString
valueOf


Option

defaultSelected
index
selected
selectedIndex
text
value



options array

length



Password

defaultValue
form
name
type
value

blur
focus
select

onBlur
onChange
onFocus
onKeydown
onKeypress
onKeyup
onSelect

Plugin

description
filename
name

refresh


plugins array

length



Radio

checked
defaultChecked
form
name
type
value

blur
click
focus

onClick
onmouseDown
onmouseUp

radio array

length



Reset

form
name
type
value

blur
click
focus

onClick
onmouseDown
onmouseUp

screen

availHeight
availLeft
availTop

availWidth
BufferDepth
colorDepth
height
pixelDepth
updayeInterval
width



Select

form
length
name
options
selectedIndex
type

blur
focus

onChange

String

length

anchor
big
blink
bold
charAt
charCodeAt
concat
fixed
fontcolor
fontsize
formCharCode
indexOf
italics
lastIndexOf
link
match
replace
search
slice
small
split
strike
sub
substr
substring
sup
toLowerCase
toUpperCase


Submit

form
name
type
value

blur
click
focus

onClick
onMouseDown
onMouseUp

Text

defaultValue
form
name
type
value

blur
click
focus
select

onBlur
onChange
onFocus
onKeydown
onKeyup
onSelect

Textarea

defaultValue
form
name
type
value

blur
click
focus
select

onBlur
onChange
onFocus
onKeydown
onKeyup
onSelect

window

clientInformation
closed

defaultStatus
dialogArguments
dialogHeight
dialogLeft
dialogLeft
dialogTop
dialogWidth

document
event
frames
history
innerHeight
innerWidth

length
location
locationbar
menubar

name
navigator
offscreenBuffering
opener
outerHeight
outerWidth
pageXOffset
pageYOffset

parent
personalbar
screen
screenX
screenY
scrollbars

self
status
statusbar

toolbar
top

alert
back
blur

close
confirm
find
focus
forward
home
moveBy
moveTo
navigate

open
print
prompt
resizeBy
resizeTo

scroll
scrollBy
scrollTo
stop

onBlur
onError
onFocus

onLoad
onResize
onUnload


출처 :JASKO

신고
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<script language="javascript">
function all_blur() {
 for (i = 0; i < document.links.length; i++)
 document.links[i]. = document.links[i].blur;
}
</script>
신고

'Developer > JavaScript' 카테고리의 다른 글

JavaScript Object Table  (0) 2007.05.03
문서 內 모든 링크의 아래점선 없애기  (0) 2007.05.03
윈도 크기에 따라 글자크기 변경  (0) 2007.05.03
페이지 직접생성 팝업  (0) 2007.05.03
Posted by marga
크리에이티브 커먼즈 라이선스
Creative Commons License
<script language="javascript">
function fnFontScale (windowWidth, fontSize, fontUnit) {
 if (typeof oFont == 'undefined'){
  oFont = new Object;
  oFont.windowWidth = parseInt(windowWidth);
  oFont.fontSize = parseInt(fontSize);
  oFont.fontUnit = fontUnit;
 }
 var screenWidth = document.body.offsetWidth;
 var scaledFont = oFont.fontSize * (screenWidth / oFont.windowWidth);
 document.body.style.fontSize = scaledFont + oFont.fontUnit;
}
window.onresize = fnFontScale;
</script>
신고

'Developer > JavaScript' 카테고리의 다른 글

문서 內 모든 링크의 아래점선 없애기  (0) 2007.05.03
윈도 크기에 따라 글자크기 변경  (0) 2007.05.03
페이지 직접생성 팝업  (0) 2007.05.03
자바스트립트 객체  (0) 2007.05.02
Posted by marga


티스토리 툴바