jQuery의 숨겨진 디스플레이와 페이드 효과 (3)
3346 단어 jqueryslowfadetogglefadetoFast
jQuery에서는 HTML 요소를 숨기고 표시하는 데 hide() 및 show() 방법을 사용할 수 있습니다.
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
선택할 수 있는speed 매개 변수는 숨기기/표시 속도를 규정하고'slow','fast'또는 밀리초 값을 얻을 수 있습니다.선택할 수 있는 콜백 매개 변수는 완성된 후에 실행되는 함수 이름을 숨기거나 표시합니다.
인스턴스
$("button").click(function(){
$("p").hide(1000);
});
jQuery toggle()
jQuery를 통해hide()와 show() 방법을 전환하는 toggle () 방법을 사용할 수 있습니다.
$(selector).toggle(speed,callback);
선택할 수 있는speed 매개 변수는 숨기기/표시 속도를 규정하고'slow','fast'또는 밀리초 값을 얻을 수 있습니다.선택할 수 있는 콜백 매개 변수는 toggle () 방법이 완성된 후에 실행되는 함수 이름입니다.
숨겨진 요소를 표시하고 숨겨진 요소를 표시합니다.
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p:first").toggle(1000);
});
});
</script>
</head>
<body>
<button> / </button>
<p> 。</p>
<p> 。</p>
</body>
</html>
jQuery 효과 - 페이드 아웃
jQuery를 사용하면 요소의 페이드 효과를 얻을 수 있습니다.jQuery에는 다음과 같은 네 가지 패드 방법이 있습니다.
fadeIn()
fadeOut()
fadeToggle()
fadeTo()
jQuery fadeIn()은 숨겨진 요소를 페이드하는 데 사용됩니다.
$(selector).fadeIn(speed,callback);
선택할 수 있는 speed 매개 변수는 효과의 시간을 정합니다.그것은 "slow", "fast"또는 밀리초 값을 얻을 수 있습니다.선택할 수 있는 콜백 매개 변수는fading이 완성된 후에 실행되는 함수 이름입니다.다음 예에서는 서로 다른 매개변수가 있는 fadeIn() 방법을 보여 줍니다.
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
jQuery fadeOut() 메서드는 보이는 요소를 페이드아웃하는 데 사용됩니다.
$(selector).fadeOut(speed,callback);
선택할 수 있는 speed 매개 변수는 효과의 시간을 정합니다.그것은 "slow", "fast"또는 밀리초 값을 얻을 수 있습니다.선택할 수 있는 콜백 매개 변수는fading이 완성된 후에 실행되는 함수 이름입니다.다음 예에서는 서로 다른 매개변수가 있는 fadeOut() 방법을 보여 줍니다.
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
});
jQuery fadeToggle () 방법은fadeIn ()과fadeOut () 방법 사이를 전환할 수 있습니다.요소가 페이드아웃된 경우 fadeToggle()은 요소에 페이드 효과를 추가합니다.요소가 페이드인 경우 fadeToggle()은 요소에 페이드 효과를 추가합니다.
$(selector).fadeToggle(speed,callback);
선택할 수 있는 speed 매개 변수는 효과의 시간을 정합니다.그것은 "slow", "fast"또는 밀리초 값을 얻을 수 있습니다.선택할 수 있는 콜백 매개 변수는fading이 완성된 후에 실행되는 함수 이름입니다.다음 예에서는 서로 다른 매개변수가 있는 fadeToggle() 방법을 보여 줍니다.
인스턴스
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
});
jQuery fadeTo () 방법
$(selector).fadeTo(speed,opacity,callback);
필요한 speed 매개 변수는 효과의 시간을 정합니다.그것은 "slow", "fast"또는 밀리초 값을 얻을 수 있습니다.fadeTo () 방법에 필요한 opacity 매개 변수는 페이드 효과를 지정한 불투명도로 설정합니다. (값은 0과 1 사이입니다.)선택할 수 있는 콜백 매개 변수는 이 함수가 완성된 후에 실행되는 함수 이름입니다.다음 예제에서는 fadeTo() 매개 변수가 다른 방법을 보여 줍니다.
$("button").click(function(){
$("#div1").fadeTo("slow",0.15);
$("#div2").fadeTo("slow",0.4);
$("#div3").fadeTo("slow",0.7);
});
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.