Category Archives: JavaScript

자바스크립트로 이미지 캐싱을 하자! (롤오버 탭전환 등)

By | 6월 26, 2009

# 자바스크립트 이미지캐싱의 개념 자바스크립트를 사용하여 현재 페이지 영역에 이미지객체를 만들어 놓으면, 같은 URL로 이미지를 호출하는 상황에서 물리적인 이미지를 호출하지 않고 현재 페이지 영역에 만들어져 있는 이미지 객체를 호출한다. (Fiddler로 확인 가능) # 자바스크립트 이미지캐싱의 용도 개발을 해 보니, 마우스 롤오버로 탭 전환 같은 것을 할 때 반드시 필요하다는 생각이 들었다. (>, < ) 짱 좋음!… Read More »

Window객체 – 메소드 – setTimeout/clearTimeout

By | 6월 10, 2009

[출처] Window객체 – 메소드 – setTimeout/clearTimeout|작성자 꿈의인생 setTimeout 메소드는 일정한 간격으로 함수를 호출하여 수행할 수 있게 해준다. clearTimeout메소드는 setTimeout메소드에 의해 일정한 간격으로 수행하는 함수를 중지하기 위해 사용된다.   – 형식 – 변수 = setTimeout(호출함수, 간격)          clearTimeout(변수) → [호출함수]는 사용자가 임의로 만든 함수 → [간격]은 일정한 간격으로 호출되는 시간을 설정한다.(1000 = 1초) → [변수]는 setTimeout과 clearTimeout… Read More »

[자바스크립트] for ~ in 구문에 대하여…

By | 6월 6, 2009

for ~ in 구문은 객체의 속성을 나열할때 사용합니다. for (var prop in myRectangle) {       //myRectangle 객체의 속성만큼 루프를 돌게됩니다.         document.write(myRectangle[prop]+”<br>”); //myRectangle의 속성을 출력합니다. } //여기서 prop는 for (i=0;i<10;i++){} 이런구문의 i와 마찬가지로 별의미 없습니다. key인거죠. //prop 대신에 prop1, prop2 등 아무거나 와도 됩니다.

[자바스크립트] typeof 연산자

By | 6월 6, 2009

* 개요    typeof 연산자는 형식 정보를 문자열로 반환합니다.     typeof는 “number”, “string”, “boolean”, “object”, “function”, “undefined”라는 6가지 형식을 반환할 수 있습니다.    선택적인 요소로 typeof 구문에 괄호를 사용할 수도 있습니다. * 용법    if( typeof ‘abc’ == ‘string’ ){…}         //괄호 사용 안함    if( typeof(‘abc’) == ‘string’ ){…}        //괄호 사용… Read More »

[자바스크립트] instatnceof

By | 6월 6, 2009

[출처] 자바스크립트의 instatnceof|작성자 구나미 자바스크립트에서 instanceof의 사용법….  만약 Array같은 객체의 인덱스를 숫자로 주지 않고 String의 값으로 준다면 리스트.length가 먹히지 않는다. 이럴때 instanceof를 사용하면 무척이나 유용하다. 아래와 같은 방법으로 사용하도록 하라…   for(var i in 리스트) {     if ( 리스트[i] instanceof Array ) {         alert(리스트[i]);     } }  

[AJAX] 간단한 AJAX 호출 함수

By | 6월 4, 2009

//xmlHttp 객체 생성 function createHttp() {  try {   return new XMLHttpRequest();  }  catch (e) {   var objectNames = [“MSXML2.XMLHTTP.5.0”,     “MSXML2.XMLHTTP.4.0”, “MSXML2.XMLHTTP.3.0”,     “MSXML2.XMLHTTP”, “Microsoft.XMLHTTP”];   for (var i = 0; i < objectNames.length; i ++) {    try {     return new ActiveXObject(objectNames[i]);     break;    }    catch (e) {   … Read More »

자바스크립트 객체지향 (OOP)

By | 6월 2, 2009

[출처] 자바스크립트 객체지향 (OOP)|작성자 롤링 JSON (객체표기법(JavaScript Object Notation) 방식  <script type=”text/javascript” language=”javascript”> Book = {  title : “sample”  , chapter : {   title : “title01”   , page : “24”  },  chapter2 : {   title : “title02”   , page : “50”  } } Book.chapter.title = “change_title”; alert(Book.chapter.title); </script>   프로토타입(Prototype) 방식 <script type=”text/javascript” language=”javascript”> function… Read More »

event.clientX, event.clientY,style.left, style.top 팁

By | 6월 1, 2009

출처 : Tong – missle0님의 JavaScript통 style.left, style.top은 문서전체의 좌측상단을 기준으로 측정된 좌표값이고 event.clientX, event.clientY는 브라우저 클라이언트 영역의 좌측상단을 기준으로 측정된 좌표입니다. 스크롤이 되지 않은 상태에선 같은 값을 가지게 되지만, 스크롤이 된 상태라면 좌표값이 스크롤 된 양에 따라 달라집니다. 이를 일치시키려면 클라이언트 좌표에 스크롤 된 양을 더해서 계산에 포함시켜야 합니다.   document.getElementById(obj).style.left = event.clientX + document.body.scrollLeft… Read More »

스크롤 조작하기 (scroll, scrollto, scrollby, pagexoffset, pageyoffset)

By | 6월 1, 2009

[출처] Window > 창을 스크롤 (scroll, scrollto, scrollby, pagexoffset, pageyoffset)|작성자 nameless 지정 위치에 스크롤 : 창이름.scroll (x좌표, y좌표) 지정 위치에 스크롤 : 창이름.scrollto (x좌표, y좌표) 상대 위치에 스크롤 : 창이름.scrollby (x좌표, y좌표) 수평 방향의 옵셋 참조 : 창이름.pagexoffset (x좌표, y좌표) 수직 방향의 옵셋 참조 : 창이름.pageyoffset (x좌표, y좌표)   scrollby 메소드는 현재의 표시 시작 위치로부터… Read More »

[펌글] scrollTop, pageYOffset

By | 6월 1, 2009

[출처] scrollTop, pageYOffset|작성자 심진 pageYOffset : 현재 페이지의 보이는 윈도우 상에서 왼쪽 맨 모서리의 Y 위치을 반환한다. Explorer 에서는 scrollTop 를 사용한다.   브라우저의 종류에 따라서 다음과 같이 위치를 조절할 수 있다. if(IE) {      diffY = document.body.scrollTop;       diffX = 0;  }  if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }

자바스크립트(javascript) 천단위 콤마 처리 (3자리마다 콤마 처리)

By | 4월 10, 2009

– 출처 : http://www.mredkj.com/javascript/nfbasic.html –   * 문자열의 3자리마다 콤마를 추가해 주는 예제임과 동시에,  자바스크립트 정규식 치환의 좋은 예제이기도 하다. function addCommas(nStr){ nStr += ”; x = nStr.split(‘.’); x1 = x[0]; x2 = x.length > 1 ? ‘.’ + x[1] : ”; var rgx = /(\d+)(\d{3})/; while (rgx.test(x1)) { x1 = x1.replace(rgx, ‘$1’ + ‘,’ + ‘$2’); }… Read More »

input 태그에서 숫자만을 입력받도록 하는 방법

By | 4월 10, 2009

* 자바스크립트 펑션 function js_OnlyNumber(obj) {     sFilter=”[0-9]”;     if(sFilter)     {       var sKey=String.fromCharCode(event.keyCode);       var re=new RegExp(sFilter);       // Enter는 키검사를 하지 않는다.       if(event.keyCode !=9 && event.keyCode!=37 && event.keyCode!=39 && event.keyCode!=8         && event.keyCode!= 46 && event.keyCode!= 96 && event.keyCode != 97 && event.keyCode != 98         && event.keyCode!= 99… Read More »

ie6와 ie7에서의 팝업창 설정

By | 4월 10, 2009

[출처] ie6과 ie7에서의 팝업창 설정|작성자 테일 <script language=”JavaScript”> function preview() {     // IE6, IE7 구분 …     var ie7_flag = false;     ie7_flag = (window.navigator.userAgent.indexOf(“MSIE 7”) != -1);            if(ie7_flag)         {            if ( screen.width ) {                  window.moveTo( (screen.width-410)/2, (screen.height-255)/2 );… Read More »

모달창 (modal dialog window) 에서 멋대로 가로스크롤이 생기는 문제 해결 꽁수

By | 4월 9, 2009

IE7에서 작업을 하던 도중에, 모달을 띄울 때 모달 안의 내용이 넘쳐서 세로스크롤이 생기는 경우,  원치 않는 가로스크롤이 동시에 생기는 문제를 발견했다.  (이 가로스크롤은 일종의 버그로, 세로스크롤의 폭 비슷하게 좁은 폭으로 생긴다.)   이에 직장 상사께서 고안해 내신 꽁수… 1. 모달을 띄울 때 스크롤바를 아예 없앤다.     모달 property 설정시 scroll : no 2. 모달의 <body> 안쪽을 모두 감싸는… Read More »