jQuery 동적 쿨 효과 구현 요약_jquery

jQuery는 역동적인 멋진 효과를 만드는 데 강력한 이점을 가지고 있습니다. 다음은 저자가 요약한 가장 일반적으로 사용되는 방법 중 일부입니다.

1. 인라인 CSS 수정
jQyery는 인라인 CSS를 얻거나 수정할 수 있도록 .css() 메소드를 제공합니다.
.css() 메소드가 제공하는 매개변수 두 가지 유형이 있습니다. 하나는 별도의 스타일 속성과 값을 전달하는 것이고, 다른 하나는 "속성-값" 쌍으로 구성된 매핑을 전달하는 것입니다.
.css('property','value ' );
.css({'property1':'value1','property-2':'value2'})
일반적으로 숫자 값은 인용할 필요가 없지만 문자열 값은 ​​따옴표는 필요하지 않습니다. 단, 매핑 표기법을 사용할 때 속성 이름이 camelCase DOM 표기법을 사용하는 경우에는 따옴표를 생략할 수 있습니다.

2. 애니메이션 효과 없이 기본 숨기기 및 표시
.hide()
.show()
이 두 가지 방법의 기능은 즉시 숨기는 것입니다. 일치하는 요소 집합을 표시합니다.
3. 표시 속도 숨기기 및 표시 지정
.hide() 및 .show() 메소드에 따라 숨기기 또는 표시 속도를 지정할 수 있습니다. 표현 방법은 .hide('speed') 또는 .show('speed')입니다. 속도 값은 다음과 같습니다.
느림, 보통, 빠름, 보통은 0.4초, 빠름은 0.2초
숫자 값으로 표시되는 밀리초 값

4. 페이드 인 및 페이드 아웃 효과

.fadein() 일치하는 요소에 대한 페이드 인 효과를 지정합니다.
.fadeout() 일치하는 요소에 대한 페이드 아웃 효과를 지정합니다.
속도는 .fadein() 또는 .fadeout() 값(예: 느림, 보통, 빠름, 밀리초)을 사용하여 지정할 수도 있습니다.
페이드 인 및 아웃 구현은 실제로 화면의 불투명도를 높이거나 낮추는 것입니다. 일치하는 요소.
5. 애니메이션 효과 만들기
jQuery는 여러 효과가 포함된 사용자 정의 애니메이션을 만들 수 있는 강력한 .animate() 메서드를 제공합니다. .animate() 메서드는 다음 네 가지 매개변수를 허용합니다.
스타일 속성과 값을 포함하는 지도.
선택적 속도 매개변수, 기본값은 보통입니다.
선택적 여유 유형
선택적 콜백 매개변수.
6. .animate()를 사용하여 애니메이션을 생성할 때 고려해야 할 문제
변경하려는 요소에 대해 CSS가 적용하는 제한 사항
예를 들어, 요소가 설정되지 않았습니다. 상대 또는 절대로 설정된 경우 왼쪽 특성을 조정해도 일치하는 요소에는 영향이 없습니다. 모든 블록 수준 요소의 기본 CSS 위치 지정 속성은 정적입니다. 이 값은 위치 지정 속성을 변경하기 전에 요소를 이동하려고 하면 단순히 고정된 상태로 유지된다는 것을 정확하게 나타냅니다.
동시성 및 대기열 효과
jQuery에서 요소 그룹을 처리하든 여러 그룹을 처리하든 기본적으로 모두 동시에 발생하므로 동시성 문제는 고려해 볼 만한 문제가 되었습니다. 요약하면 두 가지 사항이 있습니다.
요소 그룹을 처리하는 경우 코드 순서에 따라 제어할 수 있습니다.
여러 요소 그룹을 처리하는 경우 다음을 통해 제어할 수 있습니다. 콜백 함수;