프링글이 하는 이야기

알려진 JavaScript Framework(Library) 중 최근 가장 주목을 받고 있는 것중의 하나가 jQuery로 흥미롭게 살펴보고 있다. 이전 포스트의 내용과 새로운 내용을 포함하여 정리한다. [HOME] jquery.com [UI] ui.jquery.com ui.jquery.com/themeroller/ [PLUG-IN] plugins.jquery.com [PPT] presentation - jQuery for Designers [HOWTO] - visualjquery.com - Beginner jQuery Tutorials - 5 jQuery Questions... and Answers - 5 More jQuery Questions... and Answers - How to Load In a..

mootools 기반의 MorphList 라는 mootools plugin. Flash Navigation 메뉴 효과와 같이 동적인 효과를 간단하게 구현 할 수 있다. mootools 를 기반으로 하지만 jQuery 를 이용하여 똑같이 구현한 라이브러리(lavalamp - http://www.gmarwaha.com/blog/?p=7) 도 있다. morphList를 이용한 메뉴 이미지 (From morphList Demo Site) 공식 싸이트 주소 : http://devthought.com/morphlist/ 첨부화일 : morphlist.js

mootools를 기반으로 한 간단한 슬라이드 쇼!! (* mootools는 js fw로 자세한 정보는 '이곳' 에서 확인하세요) 매우 간단한 코드 몇줄로 슬라이드 생성이 가능합니다. *예제코드.. . . . . . Loading Melbourne Buenos Aires Urubamba London Venice Paris Osaka 위의 예제코드로 인해 생성된 슬라이드 쇼 공식 출처 : http://devthought.com/barackslideshow-an-elegant-lightweight-slideshow-script/ 미국 2008 대선후보 바락오바마 의원 공식싸이트 메인 에도 적용 되어 있습니다 : http://www.barackobama.com/index.php 첨부화일 : barackslid..

Javascript 이용 웹페이지에서 대각선 및 다양한 도형을 그릴수 있습니다. 간단한 코드 입력으로 쉽게 적용 가능합니다. 다양한 제작 예제코드는 원제작사 싸이트에 가시면 다양한 샘플 코드를 직접 적용하고 확인하실 수 있습니다. 제작자 싸이트 : http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm#performance 첨부파일 : ws_jsgraphics.js v3.03

MooTools도 $()를 사용한다. Prototype도 $()를 사용한다. jQuery도 마찬가지이기에 충돌이 발생한다. jQuery.noConflict(); 한줄 추가하고 $ 대신 jQuery 사용!

다음소프트 인턴십하면서 맡게된 업무는jQuery 를 이용한, Ajax 를 사용하는 차트 UI 구성이다.그럼 jQuery 가 대체 모냐... 알아보자.The Write Less, Do More, JavaScript LibraryjQuery 홈페이지의 타이틀이다.jQuery 를 가장 잘 설명하는 문장인거 같다.코드는 적게 쓰고, 더 많은 걸 해보자는거다. 몰로 ? 자바스크립트 라이브러리로.jQuery 는 새로운걸 하는 것은 아니다.(새로워 보이는건 있지만.. 내부를 뜯어보면 아예 새로운게 짠. 나타난건 아니다.)기존에 자바스크립트로 하던 것들을 하는데 좀 편하게 해보자는거다.모든지 개요를 살피기 전, 써볼까 말까 고민할 때는 결과물을 보면 된다.쌈박한 결과물 하나 보자.jQuery ThemeRollerjQu..

readyState 프로퍼티는 Ajax 요청의 현재 상태를 나타냅니다. 프로퍼티의 값은 숫자 입니다.Ajax 기술의 핵심 객체(사실 이 객체만 생각해도 무방) 인 xmlhttp 가 가지는 property 인데 이 property 는 상태를 나타내는 프로퍼티이고 간단히 숫자로 현재 xmlhttp 객체의 상태를 나타냅니다.0 : 처음으로 xmlhttp가 생성된 상태를 말합니다. 1 : 열기. open 메소드가 호출되었으나 send 메소드는 호출되지 않았음. 2 : 송신완료. send 메소드가 호출되었음. 요청이 시작되었음. 3 : 수신 중, 서버가 응답을 보내는 중임. 4 : 수신완료. 서버가 응답을 다 보내고 작업을 완료했음var xmlhttp = getXMLHTTP () ; --> readyState =..

AJAX 예제코드 및 데모들 Ajallerix : AJAX, simple, fast Web image gallery demo ; at Novell AJAX - microlink pattern tutorial : A microlink is a link that opens up content below it. Ajax BBC News RSS Reader : demo by Nigel Crawley AJAX Chat in Python with Dojo : at AquaAjax Ajax Chess : multiplayer chess Ajax examples at BackBase : examples demonstrating several aspects of the Backbase technology. Ajax ex..

Ajax와 DOM 스크립팅을 쉽게 하는 방법... 전문을 보시려면 "요기" 를 눌러주세요.

Ajax 또는 스크립트로 "로딩중" 표시할때 로딩중 이미지를 만들어주는 싸이트 http://www.ajaxload.info/#preview

1. 비동기 자바스크립트 XML 기술이 뜨고 있다. 비동기 자바스크립트 XML 기술이 뜨고 있다.Ajax는 'Asynchronous JavaScript + XML'의 줄임말로, 뜻은 '비동기 자바스크립트 XML'이다. Ajax는 자바스크립트 렌더링 엔진을 이용한 기술로, Ajax를 이용할 경우 플래시나 액티브엑스(ActiveX) 의존도를 많이 벗어날 수 있다. 대표적으로 구글과 야후, 아마존 등의 여러 서비스에서 Ajax 기술을 활용하고 있다. 이들 사이트의 서비스는 액티브엑스를 사용하는 사이트와 달리 윈도의 익스플로러가 아닌 다른 운영체제나 브라우저에서도 사용할 수 있다. 'Ajax'라는 낱말은 제시 제임스 가렛(Jesse James Garrett)이 2005년 2월 18일 쓴 'A New Approa..

참고 : http://www.joomla.org, http://www.joomlakorea.org, http://joomla.nsrn.net, http://fireball.snu.ac.kr/joomla/ 1. 설치 mkdir joomla cp Joomla_1.0.10-Stable-Full_Package.tar.gz joomla tar xvfz Joomla_1.0.10-Stable-Full_Package.tar.gz cd joomla chmod -R 707 * http://서버주소/joomla 접속 mysql DB설정 및 joomla 기본 설정 설정후 자동 완성된 내용으로 configuration.php 작성 및 admin 계정의 패스워드 변경 chmod 707 configuration.php Instal..

웹 개발자들이 알아야 할 윈도우 XP SP2 변경점 이전에 게재된 체험! 윈도우 XP 서비스팩2을 통해 독자들은 SP2의 새로운 기능에 대한 기본적인 내용들을 훑어볼 수 있었을 것이다. 이 글에서는 개인 사용자보다는 SP2 출시로 웹 개발자들이 꼭 점검하고 수정해야 할 점들을 살펴보도록 하자. 윤석찬 (다음 R&D 센터) 2004/08/30 SP2 출시로 인해 윈도우 사용자들은 보안과 설정에 대한 선택권이 보다 넒어졌다. 그러나 기본적인 보안 기능을 강화됨에 따라 웹사이트 개발자들에게는 그 동안 별 문제 없이 사용되던 웹사이트의 기능들이 제한될 수 있다는 점을 유념해야 한다. 윈도우 XP 서비스팩2는 8월 11일 RTM 버전이 출시 되었고, 9월 2일 윈도우 업데이트를 통해 모든 윈도우 XP 사용자에게 ..

제로보드 XE 위젯 만들기 - 참고 http://seungyeop.kr/3993

CSS의 display 속성은 해당 엘레멘트가 화면에 어떻게 보여지는지를 결정하는 역할을 합니다. display 속성의 값은 다 따지면 19가지나 되지만, 실제로 자주 쓰이는 것은 inline과 block, inline-block, none 값이며, 이외의 것은 브라우저에서 지원하지 않는 것도 많기 때문에 불안정해서 사용되지 않는다고 하네요. block : 블록박스로 만든다. inline : 인라인 박스로 만든다. inline-block : 블록박스로 만들어지지만, 인라인 박스처럼 배치된다. (CSS2.1 권고후보에 추가) none : 박스를 만들지 않으며 시각적으로 완전히 보이지 않는다. inherit : 상위 요소의 display속성을 상속받는다. table : 블록레벨의 표로 만든다. (table)..

CSS 에서 가장 중요한 개념 중 하나가 박스모델입니다. 박스모델의 개념을 이해함으로써 각각의 엘리먼트를 문서에 배치하는 원리를 알 수 있기 때문입니다. 그리고 이를 응용하여 전체 레이아웃을 정의할 수도 있고, 콘텐츠를 디자인할 수도 있기 때문에 CSS를 통한 디자인을 하려면 박스모델을 이해하는 것이 필수라고 할 수 있습니다. 우선... 첫번째로 이해해야 할 명제는 "모든 엘리먼트, 태그는 박스 모델이다" 라는 것입니다. , 같은 표현을 위한 태그를 제외하면, 자주 사용하는 , , , 등의 태그들은 기본적으로 사각형(박스) 형태로 되어 있습니다. 생각해보면 이러한 태그들이 원형으로 들어가는 것은 없지요? ^^;; 두번째는 "contents, padding, border, margin" 입니다. 모든 박스..

이젠 CSS가 자바스크립트의 역할을 하나 둘 뺏어오고 있는 것 같습니다. 예전엔 복잡한 자바스크립트로 구현 가능했던 풀-다운 메뉴를 CSS만으로 구성한 예제입니다. 현재의 웹 퍼블리셔로선 CSS가 힘내서 자바스크립트를 이기길 바라는 마음이 없잖아 있지만(?) UI개발의 입장에선 자바스크립트든 CSS든 계속 발전해서 디자인단이나 개발단에서 못하는 것들을 하나둘 할 수 있는 모습을 보고 싶다는 기대를 하고 있습니다~ 출처는 cssplay.co.uk 참고로 이 사이트에선 CSS 와 (X)HTML 만을 사용하여 각종 컴포넌트(주로 메뉴)들을 만들어 공개하는 사이트. 다만 공개된 소스 중에는 무료로 사용가능한 것, 라이센스를 구입하여 쓸 수 있는 것, 무료이지만 출처를 표기해야하는 것들이 있습니다. Website..

CSS에서는 글자 폰트 크기나 width, height 등의 크기를 지정할 때 다양한 단위를 사용할 수 있습니다. (pt, px, em, ex, %) 대부분의 브라우저는 단위를 사용하지 않으면 자동으로 px단위(모니터의 픽셀)로 인식하여 렌더링을 하게 되지만, 현재 표준은 단위를 항상 명시해주는 것입니다. (0 제외) ex. DIV.test { padding:5px 0 5px 10px; font:normal 9pt 돋움; } 대부분 HTML 개발 시에는 px 단위를 사용하고 폰트 크기에는 pt, px 단위를 혼용하여 사용하고는 하는데, em 이라는 단위를 사용하자는 움직임도 있는 것 같습니다. pt, px 가 절대적인 크기를 나타내는데 반해서, em, ex, % 는 상위 엘레멘트에 대한 상대적인 크기를 ..

최근 웹 2.0 시대에 들어서 RIA가 대세가 됨에 따라... 마치 플래시와 같은 동적인 UI를 구현하기 위해서 자바스크립트 개발의 중요성이 많이 부각되었습니다. 이러한 개발을 도와주는 도구로 각종 컴포넌트와 편리한 명령어를 담은 자바스크립트 프레임워크가 많이 개발되어 있습니다. 잘 알려진 자바스크립트 프레임워크로는 Prototype.js, Dojo Toolkit, MooTools, jQuery 등이 사용되고 있죠. 그런데... 이러한 프레임워크라는 개념이 CSS에도 도입이 된 것 같습니다. 저도 나름 새로운 사이트를 들어갈 때나, 프리랜스로 작업할 때 CSS의 기초로 사용하는 파일을 가지고 있구요.. 이를 바탕으로 작업을 진행합니다. 이것의 확장된 개념이라고 할 수도 있을까요? 그와 더불어 디자이너 입..

http://www-128.ibm.com/developerworks/kr/library/wa-ajaxintro1.html Ajax 마스터하기, Part 1: Ajax 소개 (한글) Ajax 마스터하기, Part 2: JavaScript와 Ajax를 이용한 비동기식 요청 (한글) Ajax 마스터하기, Part 3: Ajax의 고급 요청 및 응답 (한글) Ajax 마스터하기, Part 4: 웹 응답에 DOM 활용하기 (한글) Ajax 마스터하기, Part 5 : DOM 다루기 (한글) Ajax 마스터하기, Part 6: DOM 기반 웹 애플리케이션 구현 (한글) Ajax 마스터하기, Part 7: 요청과 응답에 XML 사용하기 (한글) Ajax 마스터하기, Part 8: 요청과 응답에 XML 사용하기 O'R..