Toggle

    jQuery] 이펙트 메서드( slide, fade, animate )

    jQuery] 이펙트 메서드( slide, fade, animate )

    이펙트 메서드 hide() show() toggle() slideUp() slideDown() slideToggle() fadeOut() fadeIn() fadeTo() fadeToggle() animate() ​ ​ ​ ​ $("b").click(function(){ $("p").toggle(); $("p").each(function(i){ $(this).animate({ "top": 50 * (i + 1) + "px" }, 1000); }); }); div영역은 숨겨져 있습니다. 하지만 위의 코드로인해 이펙트 메서드라는 텍스트를 클릭하면 다시 보이게 됩니다. ​ 이제 각각의 이펙트 메서드들의 효과를 하나씩 볼까요? if(ele.is("p:contains(hide)")){ $("img").hide();..

    [jQuery] show(), css(), toggle(), hide()

    [jQuery] show(), css(), toggle(), hide()

    이미지 보이기 이미지 축소 이미지 확대 이미지 추가 이미지 숨기기/보이기 ​ ​ ​ ​ $(document).ready(function(){ $("img").click(function(){ alert("이미지를 클릭했습니다."); $(this).hide(); }); }); 지난번 포스팅에서 제이쿼리문을 작성하는 두가지 방법중 하나입니다. 굳이굳이 이렇게 한번 해봤습니다,,, 해당 코드는 "img" -> 태그를 클릭하면 이벤트가 발생합니다. "이미지를 클릭했습니다."라는 메세지를 출력시키며 $(this)자신을 hide()숨깁니다. 클릭해볼까요? ​ ​ function showImg(){ $("img").show(); } 이 함수는 이미지 보이기 버튼을 클릭하면 실행됩니다. 함수가 실행되면 이미지가 show..