본문 바로가기

Programming136

파이어버그를 이용한 자바스크립트 디버깅.. FireBug는 파이어폭스의 디버그용 에드온 입니다. 이 파이어버그를 이용해서 javascript를 좀 더 유연하고, 우아하게 디버깅하는 방법을 소개 해 볼까 합니다. 전 이걸 모르기 전까지는 주로 alert을 사용해서 주로 디버깅을 했습니다. -_-;; 정말 시끄럽고 우아하지 않은 방법이였는데. firebug 덕분에 우아한 자바스크립드 디버깅이 가능해 졌습니다 ^^; 먼저 준비물.. FireFox : http://www.mozilla.or.kr/ko/ FireBug (파이어폭스 에드온) : https://addons.mozilla.org/en-US/firefox/addon/1843 파이어폭스를 설치 하시고 에드온을 설치 하시면 됩니다. 설치가 제대로 되었다면 위 스샷과 같이 바퀴벌레 한마리가 파폭 오른.. 2009. 9. 23.
HTML에서 FLASH로 변수 전달하기..(AS 3.0) 2부... HTML에서 FLASH로 변수 전달하기..(AS 3.0) 라는 제목으로 포스팅을 했었습니다. 그런데, objectswf.js를 사용 할 때에는 이전에 썼던 방법으로 값이 전달 되지 않는 문제가 있어서, 수정한 코드를 새로 올려 드립니다. 예제는 이전과 비슷한 폼입니다. 위와 같이 생긴 플래쉬 파일을 만들고... 다이나믹 텍스트로 tx_userName, tx_gender라는 파일을 만들었습니다. 기본적으로 출력하는 폼에 FlashVars를 추가해 줍니다. Alternative content 그리고 플래쉬 소스에는 아래와 같이 입력해 줍니다. var paramObj:Object = LoaderInfo(this.root.loaderInfo).parameters; tx_userName.text = paramOb.. 2009. 9. 21.
Flash에서 z-index 문제 해결 방법... Flash를 홈페이지에 넣고... jquery로 z-index로 모달을 만들어서 사용 할려고 하면, flash가 z-index와는 아무 상관 없이.. 떡하니.. 위에 나오는 문제가 발생합니다. 이를 해결 하는 방법은 아래와 같습니다. 여기에서 사용한 swfobject.js는 아래 주소의 swfobject 최신 버전을 사용했습니다. 주소 : http://code.google.com/p/swfobject/ Alternative content 테스트 레이어 분명히 test 위치해 있는데.. flash가 떡하니 위로 나오는 문제가 발생합니다. 해결 방법은 간단합니다. Alternative content 테스트 레이어 params에 wmode: 'opaque'를 추가해 주면 아래와 같이 정상적으로 출력 됩니다. .. 2009. 9. 21.
PHP, RUBY, JS, CSS 프레임워크 비교 사이트.. 웹개발 프레임 워크를 비교해 놓은 사이트가 있어서 소개 합니다. 각 프레임 워크별로 비교를 하고 있고 필요한 기능들과 라이센스를 표기하고 있습니다. 주소 : http://www.bestwebframeworks.com/ 프레임워크 비교해 놓은 것을 커닝해 보겠습니다. 자세한 내용은 각 이미지를 클릭해 보세요. 2009. 9. 21.
Javascript URL Base64 인코딩/디코딩 URL에서 한글을 쓸 때 문제가 생겨서 URL을 인코딩/디코딩을 이것저것 실험해 보다.. 한글에도 문제가 없는 것을 찾았습니다. 주소 : http://www.webtoolkit.info/javascript-base64.html 우선, 이 코드가 별 문제가 없이 되는것을 확인 했습니다. 간단하게 예제 프로그램을 만들어서 올립니다. 아래에서 실행해서 테스트 해 보셔도 괜찮습니다. 문자입력 상자에 문자를 입력하면 각 해당 방법으로 인코딩/디코딩 한 문자열이 출력 됩니다. 그리고 인코딩이나 디코딩한 문자열을 문자입력 상자에 적용해 보고 싶으면 apply를 클릭해 주시면 됩니다. 문자입력 base64 encoded data (apply); UTF-8 encoded data (apply); URL Encoded d.. 2009. 9. 18.
JavaScript Framework 비교 사이트. javascript framework를 비교해 주는 사이트가 있어서 이렇게 소개 드립니다. 주소 : http://matthiasschuetz.com/javascript-framework-matrix/en/ JavaScript Framework Matrix 라는 사이트 인데.. 여러가지 스크립트 엔진 성능과 문법을 비교해 놓고 있습니다. 자바스크립트 프레임워크를 사용하시다가, 다른 프레임워크로 변환 할려고 할때 문법을 비교 하는데도 많은 도움이 될 것 같습니다. 이 사이트에서 비교하고 있는 자바스크립트 프레임워크는 아래와 같습니다. jQuery MooTools The Dojo Toolkit Prototype Script.aculo.us Ext.JS Adobe Spry BBC Glow Yahoo UI! Li.. 2009. 9. 14.
HTML에서 FLASH로 변수 전달하기..(AS 3.0) ActionScript 3.0을 사용하면서, 이것저것 많은 것이 변했더군요. 3.0으로 올리면서 여러가지 혼란을 격고 있습니다. 이 포스팅에서는 HTML에서 FLASH로 변수를 전달하는 방법에 대해서 써 볼려고 합니다. 예제로 폼을 위와 같이 만들고, 위에 textfiled의 이름을 tx_userName,아래는 tx_gender라고 줬습니다. 그리고 아래와 같이 코드를 작성했습니다. function loaderComplete(myEvent:Event) { var flashVars=this.loaderInfo.parameters; tx_userName.text=flashVars.userName; tx_gender.text=flashVars.gender; } this.loaderInfo.addEventLis.. 2009. 9. 11.
자바스크립트 압축 풀기(javascript decompress) 가끔 웹 소스를 분석하다 보면, 로딩속도를 위해서 자바스크립트를 한줄로 쫘악 해 놓은 경우가 있습니다. 이럴때 정말 분석하기 난감하죠 ^^;; 그렇다고 한줄씩 칸 내리기를 하기도 그렇구... 이럴때 한번에 이런것을 해결해 주는 사이트가 있어서 소개 할려고 합니다. 주소 : http://jsbeautifier.org/ (function($){$.fn.extend({accordion:function(){return this.each(function(){if($(this).data('accordiated'))return false;$.each($(this).find('ul, li>div'),function(){$(this).data('accordiated',true);$(this).hide()});$.each.. 2009. 9. 8.
jQuery를 이용한 클라이언트 측 폼 검증(Form Validation) 주소 : http://vanadiumjs.com/ 웹 페이지를 작성하다 보면 폼검증에만 많은 시간을 낭비 할 경우가 많습니다. 서버 측에서도 하지만, 클라이언트에도 폼을 검증하기 위해서 각 폼의 이름과 내용을 확인하면서 자바 스크립트를 짜게 되죠. 하지만, 이 jQuery 플러그인을 사용 한다면, 그런 걱정이 반으로 덜 것 같습니다. VanadiumJS는 클라이언트 사이드에서 폼 검증을 하는 파워풀한 jQuery plugin입니다. Ajax를 이용해서 서버측 결과 값도 받을 수 있습니다. 이 플러그인을 사용하시면 2가지 방법으로 폼을 검증 하실 수 있습니다. JSON 구조를 이용한 검증. 인라인 검증 그리고 사용 방법은, 정말 허망 하다 싶을 정도 간단합니다. 제가 게으른 관계로 사이트에서 캡쳐해서 간단.. 2009. 9. 5.
CodeIgniter matchbox 0.9.4 사용할 때 form_validation 오류 해결. 요즘 codeingiter에서 matchbox를 사용해서 모듈화를 해서 제작을 하고 있습니다. 그런데 0.9.4 이후로 업데이트가 안 되고 있네요 -_-;; matchbox를 사용할 경우 form_validation 라이브러리를 사용 할 경우.. 에러 체크가 표시되지 않는 문제가 있습니다. 위 파일을 받아서 확장자를 변경 후, /application/libraries 폴더에 넣어 주시면 됩니다. 참고 : http://codeigniter.com/forums/viewthread/95755 이후에 포럼에 글을 올렸는데.. matchbox 0.9.4의 문제를 패치해서 올린 ci 1.7.1버전에 있네요... 초기에 도입하시는 분은 받아서 분석해 보셔도 괜찮을 것 같습니다. matchbox를 사용한 프로젝트가 있.. 2009. 9. 4.

티스토리툴바