먼저, 아래 링크를 클릭해서 이전 예제를 참조하세요.
2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기 예제
.more { color: blue; font-size: 25px; font-weight: bold; text-decoration: underline; }
말줄임표(...)에 스타일시트에 more 클래스를 정의합니다.
$("p:eq(1)").hide(); /* <p> 태그 중 첫번째 객체를 숨긴다. */ $("span.more").click(function() { $("p:eq(1)").show('slow'); $(this).hide('slow'); });
show()는 객체를 보이게 하고, hide()는 숨기는 명령입니다. show('slow')는 객체를 천천히 보이게 하고, hide('slow')는 천천히 사라지게 합니다.
$("span.more").click(function() {...} ==> span 태그 중에 class="more"로 정의된 영역을 클릭하면 실행하는 명령들입니다.
'프로그래밍 언어 > jQuery' 카테고리의 다른 글
[jQuery] 제이쿼리로 전체선택/선택해제 간단하게 구현해 보는 예제입니다. (0) | 2014.12.05 |
---|---|
[jQuery] 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기, 애니메이션으로 버튼 크기 조절하는 예제 (2) | 2014.12.03 |
[jQuery] 글자 폰트 사이즈 늘리고 줄이기 예제 (0) | 2014.12.03 |
[jQuery] 행에 징검다리 스타일 입히기 (:odd, :even) (0) | 2014.12.03 |
[jQuery] 리스트 항목에 레벨 단위로 스타일 입히기 (UL, LI 태그) (0) | 2014.12.03 |
댓글