기본 애니메이션 코드: 코드 복사 코드는 다음과 같습니다. Hello World jQuery! <br>$(document).ready(function()<br>{</p> //callback, 시그니처는 다음과 같습니다: function callback() {this;} 콜백 함수의 this는 이 함수를 실행하는 DOM 객체입니다. <br>//콜백 함수이기 때문에 생략 가능하므로 값만 매개변수로 전달하면 매개변수에서 지정한 시간 내에 요소가 애니메이션 효과와 함께 표시/숨겨집니다. <br>//매개변수는 세 가지 미리 결정된 속도("느림", "보통", "빠름") 중 하나가 포함된 문자열을 사용<br>//또는 숫자를 직접 사용하여 애니메이션 지속 시간을 나타냅니다. 단위는 밀리초 값(예: 500)입니다.<br> <br>//애니메이션 속도<p>var speed = 500;<br>//바인딩 이벤트 처리<br>$("#btnShow").click(function(event)<br>{<br> //이벤트 버블링 취소<br>event.stopPropagation();<br>//팝업 레이어 위치 설정<br>var offset = $(event.target).offset();<br>$("#divPop " ).css({ top: offset.top $(event.target).height() "px", left: offset.left });<br>//애니메이션 표시<br>$("#divPop") . show(speed);<br>});<br>//팝업 레이어를 숨기려면 빈 영역을 클릭하세요<br>$(document).click(function(event) { $("#divPop"). hide(speed ) });<br>//숨기려면 팝업 레이어를 클릭하세요<br>$("#divPop").click(function(event) { <br>event.stopPropagation()<br>$( "#divPop ").hide(속도);<br>});<br> <br></p>var Flip = 0;<p>$("#btnP").click(function () {<br>$("p").toggle("fast");<br>// $("p").toggle( 플립 % 2 == 0 );<br>});<br> <br></p>//이벤트 처리 바인딩<p>$("#btnT").click(function(event)<br>{<br>//이벤트 버블링 취소<br>event.stopPropagation() ;<br>//팝업 레이어 위치 설정<br>var offset = $(event.target).offset();<br>$("#divPop").css({ top: offset.top $(event.target ).height() "px", 왼쪽: offset.left });<br>//팝업 레이어 표시 상태 전환<br>$("#divPop").toggle(speed);<br>}) ;<br> <br>});</p> <버튼 ID ="btnShow">프롬프트 텍스트 표시단락 표시기능 테스트 전환< ;/div>팝업 레이어 문단입니다두 번째 문단입니다 html>=================================== === ======================= 슬라이딩 애니메이션 및 투명 애니메이션 효과 코드: 코드 복사 코드는 다음과 같습니다. Hello World jQuery! <br>$(document).ready(function()<br>{</p> <p>//滑动动画效果<br>$("#btnShow").click(function(){<br>$("#divPop").slideDown("fast");<br>});</p> <p>$("#btnHide").click(function(){<br>$("#divPop").slideUp("slow");<br>});</p> <p>$("#btnT").click(function(){<br>$("#divPop").slideToggle("slow");<br>});</p> <p><br>//透명도动画效果</p> <p>$("#bShow").click(function(){<br>$("#divPop").fadeIn(2000);<br>});</p> <p>$("#bHide").click(function(){<br>$("#divPop").fadeOut("slow");<br>});</p> <p>//指정到透명도<br>$("#bHelf").click(function(){<br>$("#divPop").fadeTo("slow",0.3);<br>}) ;</p> <p> </p> <p>});<br> <버튼 ID ="btnShow">显示提示文字隐藏提示文字toggle函数测试< /button>淡入淡流半透明弹个是一个段落这个是第二个段落< /p>