jQuery 5 collapsible.list.take.1.html Collapsible List — Take 1 Item 1 Item 2 Item 3 Item 3.1 Item 3.2 Item 3.2.1 Item 3.2.2 Item 3.2.3 Item 3.3 Item 4 Item 4.1 Item 4.2 Item 4.2.1 Item 4.2.2 Item 5 =========================================== collapsible.list.take.2.html Collapsible List — Take 2 Item 1 Item 2 Item 3 Item 3.1 Item 3.2 Item 3.2.1 Item 3.2.2 Item 3.2.3 Item 3.3 Item 4 Item 4.1 Item 4.2 Ite.. 더보기 jQuery 4-2 get() Reversed - One Two Three ========================================================================== map() Values: ====================================== Bamboo Asian Grille Online Order Menu Appetizers Fried Imperial rolls (2) $ Pork Vegetarian Spring rolls (2) $ Pork Pork and Shrimp Vegetarian Vietnamese rolls (4) $ Pork Pork and Shrimp Vegetarian Crab rangoon (8) $ 더보기 jQuery 4 jquery.events.html ================================================================= jquery.propagation.html =============================================================================== toggle.html ====================================================== one() Click a green square... ========================================================================= unbind() Does nothing... Bind Click Un.. 더보기 DOM 이해하기(퍼옴) 지난글 이것은 텍스트에서 객체 모델로 변환된다. 코드가 단순하건 복잡하건 간에, 하나의 파일에 저장하든 또는 개별 파일들에 모든 것을 저장하든 간에 이것은 사실이다. 브라우저는 제공된 텍스트 파일 보다는 객체 모델을 사용한다. 브라우저가 사용하는 모델을 문서 객체 모델(Document Object Model)이 라고 한다. 이것은 문서에 있는 엘리먼트, 애트리뷰트, 텍스트를 나타내는 객체들을 연결한다. HTML과 CSS에 있는 모든 스타일, 값, 심지어 거의 모든 공간들은 객체 모델로 통합된다. 웹 페이지에 대한 특정 모델은 그 페이지의DOM 트리라고 한다. DOM 트리가 무엇인지를 이해하고 이것이 어떻게 HTML과 CSS를 나타내는지를 아는 것이 웹 페이지를 제어하는 첫 번째 단계이다. 그런 다음에는 .. 더보기 jQuery 3 Move and Copy Laboratory Source elements Target elements appendTo prependTo Execute 더보기 [jQuery] 엘리먼트 조정 (퍼옴) 어트리뷰트 값 설정하기 attr() 커맨드는 일치하는 집합에서 첫 번째 엘리먼트에 있는 어트리뷰트 값을 가져오거나 일치하는 모든 엘리먼트에 있는 어트리뷰트 값을 설정하는데 사용한다. attr(name) - 일치하는 집합의 첫 번째 엘리먼트에서 매개변수로 명시된 어트리뷰트의 값을 얻는다. 매개변수 - name:(String)값을 가져올 어트리뷰트의 이름 반환값 - 첫 번째로 일치하는 엘리먼트의 어트리뷰트 값. 일치하는 것이 없을 경우 undefined를 반환 위의 커맨드를 예제로 들기 위해 임의의 태그를 설정하자. 이 때 위의 이미지에서 'title'의 값을 가져오고 싶다면 아래와 같은 코드처럼 사용하면 된다. $('#myImage').attr('title') attr() 커맨드는 매개변수에 무엇이 들어가.. 더보기 jQuery 빠른 처리를 위한 CSS 셀렉터 사용팁 jQuery 에서는 CSS 셀렉터 와 엘리먼트를 선택해 처리하는 방법을 사용합니다. 그러나 이런 CSS 셀렉터 사용법을 좀더 잘 사용하면 처리속도의 향상을 가져옵니다. 여기에서 jQuery의 내부 처리와 같은 코드를 보고, jQuery를 빠르게 사용하기 위한 TIP 5 를 소개하고자 합니다. 1. 여러번 같은 실렉터를 실행하지 않는다. 2. 클래스만으로 지정하는 것을 금지한다. 3. #id 의 사용을 적극 권장한다. 4. 도중까지 결과를 재이용 한다. 5. 자식 셀렉터(>)를 잘 사용하면 처리가 빨라진다. 1. 여러번 같은 실렉터를 실행하지 않는다. ㅁ 개선전 // 예제1 $("div.foo").addClass("bar"); $("div.foo").css("background","#ffffff"); $(.. 더보기 jQuery 샘플 링크 (퍼옴) >> Lightbox, Modal Window 관련 jQuery lightBox plugin 매우 심플한 Lightbox 플러그인. Facebox 이미지 뿐아니라 텍스트도 표시할 수 있는 팝업창. prettyPhoto a jQuery lightbox clone Lightbox 클론 NyroModal 이미지나 Youtube의 동영상 폼 등 가능. SimpleModal 이름과 같이 매우 심플한 모달창 >> 이미지 관련 jQZoom 돋보기 기능, 이미지를 확대(zoom) 기능 jQuery virtual tour 부동산 중개에서 물건 소개등에서 사용할 법한, 가상 투어 기능 Photo Slider 썸네일 이미지들의 움직임이 좋은 포토 슬라이더 jQuery Cycle Plugin 슬라이더 쇼 플러그인 jCarou.. 더보기 jQuery 셀렉터로 기능 확장할 엘리먼트 선택하기 ⊙ 자식셀렉터(child selector) p > a -부모와 자식 엘리먼트는 오른쪽 부등호(>)로 구분 -엘리먼트의 바로 아래 자식 링크와 일치 ⊙ 어트리뷰터 셀렉터(attribute selector) a[href^=http://] -http://로 시작하는 모든 링크와 일치 form[method] -method어트리뷰트를 가지는 엘리먼트와 일치 input[type=text] -특정값을 일치시킨 형태 -셀렉터는 type이 text인 모든 input엘리먼트와 일치 ⊙ 컨테이너셀렉터(container selector) -다른 엘리먼트를 선택해야 할때 사용 li:has(a) -엘리먼트를 포함하는 모든 엘리먼트와 일치 foo:not(bar:has(baz)) --한단계 중첩 허용 foo:not(bar:has(b.. 더보기 jQuery 2 new.divs.html Div 1 Div 2 Div 3 ============================================================================ dimensions.html Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam eget enim id neque aliquet porttitor. Suspendisse nisl enim, nonummy ac, nonummy ut, dignissim ac, justo. Aenean imperdiet semper nibh. Vivamus ligula. In in ipsum sed neque vehicula rhoncus. Nam faucibus ph.. 더보기 이전 1 ··· 40 41 42 43 44 다음