작성일 : 11-11-29 20:15
|
[JQuery] JQuery Source hidden toggle
|
|
|
글쓴이 :
조형래
 조회 : 3,990
|
<style type="text/css">
.hidden { display:none; }
</style>
<script src="js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
// .toggle(fn1, fn2); // fn1과 fn2를 서로 토글링한다...
$("#btn").toggle(
function () { $('#myLayer').addClass("hidden"); },
function () { $('#myLayer').removeClass("hidden"); }
);
// 위 첫번째 방법, 아래 두번째 방법
$('#btn').click(function () {
$('#myLayer2').toggleClass('hidden'); //[!] hidden CSS Class에 대해서 addClass()<->removeClass()
});
});
</script>
<h1>버튼을 클릭할 때마다 레이어 보이기/숨기기</h1>
<input id="btn" type="button" value="버튼" />
<div id="myLayer" style="background-color:Yellow;">안녕</div>
<div id="myLayer2" style="background-color:Yellow;">안녕</div>
|
|