jquery가 알아야 할 몇 가지 일반적인 특수 효과 방법 및 사용 예(정리)

이 기사에서는 다음과 같이 일반적으로 사용되는 특수 효과 예제를 컴파일했습니다. jQuery fadeIn()은 숨겨진 요소를 페이드 인하는 데 사용되며 jQuery fadeToggle() 메서드는 fadeIn()과 fadeOut() 메서드 사이를 전환할 수 있습니다. 관심 있는 친구들은 참고하세요

1.jQuery fadeIn()은 숨겨진 요소를 페이드 인하는 데 사용됩니다.
구문:
$(selector).fadeIn(speed,callback);
예:

코드 복사 코드는 다음과 같습니다.

$("button").click(function(){ $( "#p1 ").fadeIn(); $("#p2").fadeIn("느린"); $("#p3").fadeIn(3000);})

2.jQuery fadeOut( ) 메서드 표시되는 요소를 페이드 아웃합니다.
구문:
$(selector).fadeOut(speed,callback);

3.jQuery fadeToggle() 메서드는 fadeIn()과 fadeOut() 메서드 간에 전환할 수 있습니다.
fadeToggle()은 이미 페이드 아웃된 요소에 페이드 인 효과를 추가합니다.
요소가 이미 페이드 인된 경우 fadeToggle()은 요소에 페이드 아웃 효과를 추가합니다.
구문:
$(selector).fadeToggle(speed,callback);
예:

코드 복사 코드는 다음과 같습니다:

$("button").click(function(){ $( "#p1 ").fadeToggle(); $("#p2").fadeToggle("slow"); $("#p3").fadeToggle(3000);})

여기서 말씀드리고 싶은 점은 일반적으로 jquery 개별 메서드를 합성하는 데는 역방향 및 가역적 방법이 있습니다. 아래의 위아래로 움직이는 것도 마찬가지입니다.

4. 구문:
$(selector).fadeTo(speed,opacity,callback)
필수 속도 매개변수는 효과의 지속 시간을 지정합니다. "느림", "빠름" 또는 밀리초 값을 사용할 수 있습니다.
fadeTo() 메서드의 필수 불투명도 매개변수는 페이드 효과를 지정된 불투명도(0에서 1 사이의 값)로 설정합니다. 예시

코드 복사 코드는 다음과 같습니다.

$("button").click(function(){
$("#p1").fadeTo("slow",0.15);
$ ("# p2").fadeTo("slow",0.4);
$("#p3").fadeTo("slow",0.7)
})

5.jQuery SlideDown() 메소드는 슬라이딩 요소를 아래로 슬라이드하는 데 사용됩니다.
구문:
$(selector).slideDown(speed,callback);
$("#flip").click(function(){ $("#panel").slideDown();}); jQuery의 SlideUp() 메소드는 요소를 위로 슬라이드하는 데 사용됩니다.
구문:
$(selector).slideUp(speed,callback)
선택적인 속도 매개변수는 효과의 지속 시간을 지정합니다. "느림", "빠름" 또는 밀리초 값을 사용할 수 있습니다.
선택적 콜백 매개변수는 슬라이딩이 완료된 후 실행되는
함수
의 이름입니다. 7.jQuery SlideToggle() 메서드는 SlideDown()과 SlideUp() 메서드 간에 전환할 수 있습니다.
요소가 아래로 슬라이드되면 SlideToggle()이 요소를 위로 슬라이드합니다.
요소가 위로 슬라이드되면 SlideToggle()이 요소를 아래로 슬라이드합니다.
$(selector).slideToggle(speed,callback);

8.jQuery animate() 메소드는 사용자 정의
animation
을 만드는 데 사용됩니다. 구문: $(selector).animate({params},speed,callback);
필수 params 매개변수는 애니메이션을 구성하는 CSS
property
를 정의합니다. 선택적인 속도 매개변수는 효과의 지속 시간을 지정합니다. "느림", "빠름" 또는 밀리초 값을 사용할 수 있습니다. 선택적 콜백 매개변수는 애니메이션이 완료된 후 실행될 함수의 이름입니다.
상대값을 정의하는 것도 가능합니다(값은 요소의 현재 값을 기준으로 합니다). 값 앞에 += 또는 -=를 추가해야 합니다.
애니메이션 그룹을 정의하여
queue
기능을 구현할 수도 있습니다. 다음 예에서는 왼쪽 속성이 250픽셀이 될 때까지

요소를 왼쪽으로 이동하는 animate() 메서드의 간단한 적용을 보여줍니다. Example

코드 복사

다음:

$(" 버튼").click(function(){ $("p").animate({left:'250px'});})

9.jQuery stop() 메소드 애니메이션이나 효과가 완료되기 전에 중지하는 데 사용됩니다.

10. 애니메이션이 100% 완료되면 콜백 함수가 호출됩니다.
일반적인 구문:
$(selector).hide(speed,callback)

11.jQuery 메서드 링크
일부 요소는 한 번만 가져오면 되므로 링크를 사용하여 메서드를 추가할 수 있습니다.
그 방법이에요. 예:
$("#p1").css("color","red").slideUp(2000).slideDown(2000);

위 내용은 jquery가 알아야 할 몇 가지 일반적인 특수 효과 방법 및 사용 예(정리)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!