jQuery 효과 - 숨기기 및 표시

숨기기, 표시, 전환, 슬라이딩, 점진적 투명도 변환, 그리고 애니메이션, 와우!

효과 시연

여기 클릭하여 패널 숨기기/표시

일시불금, 따라서, 우리는 빠르고 이해하기 쉬운 학습 내용을 제공합니다.

여기서, 이해하기 쉬운 편리한 모드를 통해 필요한 모든 지식을 얻을 수 있습니다.

예제

jQuery hide()
간단한 jQuery hide() 메서드를 시연합니다.
jQuery hide()
다른 hide() 시연. 일부 텍스트를 숨기는 방법.

jQuery hide() 및 show()

jQuery를 통해, hide()와 show() 메서드를 사용하여 HTML 요소를 숨기고 표시할 수 있습니다:

$("#hide").click(function(){
  $("p").hide();
});
$("#show").click(function(){
  $("p").show();
});

본인이 직접 시험해 보세요

문법:

$(선택자).hide(속도,callback);
$(선택자).show(속도,callback);

선택 사항 속도 파라미터는 숨기거나 표시하는 속도를 정의하며, 다음 값 중 하나를 선택할 수 있습니다: "slow", "fast" 또는 밀리초。

선택 사항 callback 파라미터는 숨기거나 표시가 완료된 후에 실행되는 함수 이름입니다。

아래 예제는 속도 파라미터 hide() 메서드:

예제

$("button").click(function(){
  $("p").hide(1000);
});

본인이 직접 시험해 보세요

jQuery toggle()

jQuery를 통해, toggle() 메서드를 사용하여 hide()와 show() 메서드를 전환할 수 있습니다。

숨겨진 요소를 표시하고, 표시된 요소를 숨기기:

예제

$("button").click(function(){
  $("p").toggle();
});

본인이 직접 시험해 보세요

문법:

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

선택 사항 속도 파라미터는 숨기거나 표시하는 속도를 정의하며, 다음 값 중 하나를 선택할 수 있습니다: "slow", "fast" 또는 밀리초。

선택 사항 callback 파라미터는 toggle() 메서드가 완료된 후에 실행되는 함수 이름입니다。

jQuery 효과 참조 매뉴얼

jQuery 효과를 전체적으로 확인하려면, 우리의 jQuery 효과 참조 매뉴얼