소프트웨어/JavaScript • Dhtml 70

JavaScript : 세상에서 가장 오해가 많은 프로그래밍 언어

[okjsp 에서 퍼왔음을 밝혀드립니다.] 요세 JS 에 대해서 왈가불가하는 분들이 많은데 아래 내용을 잘 이해하시고 , 사용하시길 바랍니다. JavaScript는 LiveScript라고 불렸어야 되지 않았나 생각됩니다. JavaScript는 Java와는 아무 관계가 없으며, Sun의 공동설립자 중 한명인 Bill Joy는 Netscape가 JavaScript라는 이름을 사용할 수 있도록 허용한 것을 후회한다고 밝힌적이 있습니다.- onjo http://www.zdnet.co.kr/news/internet/etc/0,39031281,39149821,00.htm http://www.elancer.co.kr/eTimes/page/eTimes_view.html?str=c2VsdW5vPTQ5ODQ= 자바스크립트..

Five Ajax Anti Pattern

http://www-128.ibm.com/developerworks/web/library/x-ajaxxml3/index.html 에 있는 글을 간단히 정리했다. 제목은 “Ajax에서 사용하면 안될 패턴 5가지” 쯤 될 것 같다. 설명은 이해하기 쉽도록 따로 달았지만, 해당 코드와 함께 보려면 원래 글을 읽어볼 것을 권장한다. #불필요한 타이머 사용 window.setInterval() 코드를 사용할 때 주의하라. 위 링크에 간단한 예제가 있는데, setInterval 은 내가 실행한 코드의 실행이 완료되었느냐에 상관없이 무조건 실행해버린다. 간격을 1초라고 정했는데, 어떤 이유로 코드 실행이 0.5초, 2초, 0.6초가 걸렸다고 하면…. 결과는 정말로 내가 원했던 그것일까? # 콜백에서 반환 결과를 체크..

자바스크립트 이미지 크로퍼

Dave Spurr씨는 Prototype.js와 Scriptaculous기반의 자바스크립트 이미지 크로퍼 UI(유저 인터페이스) 라이브러리를 만들었습니다. 이미지의 특정한 영역을 드래그하여 선택된 영역의 크기와 좌표 값를 반환해 줍니다. 영역을 선택하는데 필요한 모든 UI(잡아끌기, 8방향 늘리고 줄이기)를 제공하며, 최소크기, 비율고정 등의 규칙을 부여하고, 미리보기(Preview) 창을 열수도 있습니다. 데모 페이지에서 직접 사용해 보세요. ImageMagick 또는 GD library와 연동하여 프로파일 이미지 크롭, 블로그 포토 크롭 등을 Ajax로 구현할 수 있겠습니다. 참고로 , 이 라이브러리는 올라로그의 프로파일 이미지 크롭에 실제로 사용되고 있는 라이브러리이기도 합니다. 예제 : funct..

1/3로 크기로 압축된 Prototype.js

John-David Dalton씨는 Prototype.js를 압축하여 용량을 1/3 이하로 줄였습니다. 그의 패키지에는 1.4버전부터 1.5.1_rc2까지(1.5 파이널 포함) 버전별 압축파일이 각각 들어있습니다. 특히, 최근 배포된 1.5.1_rc2의 용량은 94kb로 무시못할 크기가 되어버렸습니다. 1.5.1_rc2의 압축된 버전(ultraCompressed) 용량은 26kb입니다. 압축된 파일을 인클루드하려면 아래와 같이 캐릭터셋을 "iso-8859-1"로 설정해야 합니다. 예제: 패키지 다운로드는 구글 그룹스에서 하세요. 특정 브라우저에서 문제가 있을수 있다고 하는데, 무시하고 1.5.1_rc2의 ultraCompressed버전을 인클루드 해 보았습니다. 보시다시피 오류없이 잘 돌아갑니다. 출처 ..

자바스크립트 미디어 플레이어 - JSMP

Azer Koculu씨는 자바스크립트만으로 돌아가는 미디어 플레이어(JSMP)를 만들었습니다. 실시간 버퍼링, 프로그레스바, 컨트롤러 기능을 가지고 있습니다. 작동원리를 분석해보니 조금 당황스럽더군요. 170장의 프레임별로 저장된 JPG 이미지를 로드하여 버퍼링합니다. 용량은 약 3MB입니다. 플레이되는 방식은 타이머에서 반환해준 이미지 값을 플레이어 스크린 앨리먼트의 백그라운드 스타일에 실시간 적용하여 마치 동영상처럼 이미지가 교차하게 됩니다. 사운드를 지원하지는 않습니다만, 싱크가 적절히 이루어진다면 그럴싸한 자바스크립트 미디어 플레이어가 만들어질 수도 있겠습니다. 그러나, 다른 플랫폼의 도움없이 자바스크립트만으로 사운드를 컨트롤하기는 무리수가 있습니다. 이 난관을 어떻게 해결해 나갈지 귀추가 주목되..

URL query String 간단하게 사용하기

정규식을 이용해서 간단한 코드로 만들었습니다. ^^ 1 var se = document.location.search.substr(1); 2 var qa = {}; // query array 3 se.replace(/([^=]+)=([^]*)(|$)/g, function(){ 4 qa[arguments[1]] = arguments[2]; 5 return arguments[0]; 6 }); 만약 URL이 somefile.html?a=bc&def=ghijk 라면… 저 코드를 실행한 후 - 혹은 함수로 만드셔도 됩니다 - qa.def 혹은 qa[’def’] 와 같이 접근하셔서 사용하시면 됩니다. javascript object 의 특성상 전체 갯수를 알아온다거나 하는 건 어렵습니다. 사실 하려면 못할 것은 없지..

특이한 Javascript 표현

정확히 말하면 ECMA 스크립트의 특징이지만 뭐… ^^ 첫번째, 객체의 생성 1 var arr = []; 2 var obj = {}; 3 var str = ""; 4 var arr1 = [1,2,3]; 5 var obj1 = {prop1 : 'value1', "prop2" : 'value2'}; Object는 {} 로, Array는 []로 생성할 수 있다. object 를 생성할 때 property 의 이름은 따옴표를 따로 해주지 않아도 prop1의 경우처럼 그냥 사용할 수 있다. 하지만, 혹시라도 있을지 모르는 문제점(prop1이 변수로 선언되어있다던가 하는…)을 미리 방지하기 위해서 따옴표를 붙여주도록 하는게 좋다. 단, 충돌이 없음이 확실하다면 생략해도 무방하다. 두번째, object propert..

IE7.0 에따른 이슈사항들

IE7.0 에따른 이슈사항들 1. window.status window.status 코드가 인터넷 영역에서 실행되지 않습니다 function test() { window.status = 'Hi!'; } 단 로컬에서는 됩니다 즉 로컬에 저장된 html을 실행하면 window.status가 먹지만 인터넷에 있는 window.status는 실행되지 않네요 개인적으로 js 디버깅시 자주 사용하곤 했는데 아쉬운 부분입니다 ㅠ.ㅠ 2. 태그 HTML3.2 스펙에 따라 태그는 반드시 에 위치해야 합니다 그렇지 않으면 인식하지 않는다네요 예전엔 base태그를 간간히 썼지만 요즘은 frame 을 잘 사용하지 않아서인지 거의 사용하진 않죠 3. window.close() window.close()시 나타나는 프롬프트를 회..