Internet/jQuery

간단한 제이쿼리 토글 버튼

by 1730 2014. 9. 22.

 jQuery toggle button

 

토글 대상을 display: none로 해 놓으면 접힌 상태로 시작하고 그렇지 않으면 열린 상태로 시작 합니다.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  	$(".jtoggle .btn").click(function(){
    	$(".jtoggle ul").toggle();
  	});
});
</script> 

<div class="jtoggle">
	<div class="btn">Toggle</div>
  	<ul>jQuery toggle test.&nbsp; jQuery toggle test.&nbsp; jQuery toggle test.&nbsp; jQuery toggle test.</ul>
</div>

 

$(선택자).toggle(속도,콜백);

 

Toggle button
      jQuery toggle test.  jQuery toggle test.  jQuery toggle test.  jQuery toggle test.