본문 바로가기

jQuery

[jQuery] 페이지 로드 전에 jQuery / 자바스크립트 실행하기 페이지 로드 전에 jQuery / 자바스크립트 실행하기 ■ 문제점 튀지 않는(unobtrusive) 자바스크립트 방식을 사용하는 최근의 자바스크립트 어플리케이션들은 일반저긍로 DOM이 완전히 로드되고 난 후에만 자바스크립트 코드를 수행한다. 그리고 실제로도 모든 DOM이 완전히 로드되고 난후에만 자바스크립트 코드를 수행한다. 그리고 실제로도 모든 DOM 탐색과 조작은 그들이 동작하기에 앞서 DOM이 완전하게 로드되는 것을 요구하낟. 그렇기에, 우리는 클라이언트(일반적으로 웹 브라우저)가 DOM은 완전히 로드했으나 이미지나 *.swf 파일과 같은 모든 자원들을 아직 로드하지 못한 시점을 알아내기 위한 방법이 필요하다. 만일 이를 위해서 window.onload 이벤트를 사용한다면 모든 자원들을 포함하여 전.. 더보기
[Masonry] Masonry 플러그인 세팅하기 01. http://masonry.desandro.com/ 으로 접속해서 Masonry 플러그인을 다운받는다. 02. 그럼 http://······/masonry.pkgd.min.js 파일이 열리는데. 해당 코드를 전부 복사한다. 03. 해당 내용을 텍스트 편집기에 복사 붙여넣기 하고, masonry.pkgd.min.js 파일로 저장한다. 04. 위에서 만든 masonry.pkgd.min.js 파일을 작업할 경로에 위치시키고 masonry_test.php 파일을 생성한다. 05. masonry_test.html 코드는 알래와 같다. masonry_test.html 06. 출력결과는 아래와 같다. 더보기
[jQuery] jQuery를 사용한 객체 확장 ■ jQuery를 사용한 객체 확장 -. 많은 수의 속성을 추가할 때, 사용하는 메서드는 $.extend() -. $.extend() 메서드는 다음과 같은 형태로 사용한다. ● $.extend(object, addObject, addObject, …) -. $.extend() 메서드의 첫 번째 매개 변수로 입력한 객체에 두 번째 매개 변수 이후의 객체를 합친다. jQueryExtend.html 출력결과 더보기
[jQuery] jQuery를 사용한 배열 관리 ■ jQuery를 사용한 배열 관리 -. jQuery를 사용해 배열을 관리할 때는 each() 메서드를 사용 -. each() 메서드는 매개 변수로 입력한 함수를 사용해 for in 반복분처럼 객체나 배열의 요소를 검사하는 메서드 이다. -. each() 메서드는 다음과 같이 두 가지 형태를 갖는다. ① $.each(object, function(index, item) { }) ② $(selector).each(function(index, item) { }) 01. 자바스크립트의 배열을 $.each() 메서드를 사용해 다루는 방법 jQueryArray01.html 출력결과 02. jQuery의 배열 객체를 다루는 방법 -. jQuery의 배열 객체는 따로 만드는 것이 아니라 선택자를 사용해 여러 개의 문.. 더보기
[jqGrid] 폰트 크기(font size) 변경 01. jqGrid의 기본적으로 폰트 사이즈를 지정하지 않은경우 는 아래와 같이 출력된다. 02. 아래의 소스를 스타일로 적용한다. 03. 아래 화면과 같이 전체적인 글자 크기가 변경됨을 확인할 수 있다. 더보기

티스토리툴바