[jQuery] 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기, 애니메이션으로 버튼 크기 조절하는 예제

먼저, 아래 링크를 클릭해서 이전 예제를 참조하세요.

2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기 예제

2014/12/03 - [프로그래밍 언어/jQuery] - 글자 폰트 사이즈 늘리고 줄이기, 숨기고 보이기 예제

	$("div.label").click(function() {
		$("div.button")
			.fadeTo("slow", 0.5)
			.animate({width:400}, "slow")
			.fadeTo("slow", 1.0)
			.animate({height:38}, "slow");
	});

$("div.button") 은 <div class="button">을 찾는 selecter 입니다.

fadeTo() 로 서서히 나타나는 효과를 구현했구요.

animate() 으로 버튼의 너비와 높이가 늘어날 때 움직이듯 늘어나는 모습을 구현해 줍니다.

아래 실행에서 [스타일 변환기]라는 글자를 클릭해 보시면 어떻게 동작하는지 확인하실 수 있습니다.