코드:
결과보기 »
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>jQuery jQuery.fx</title> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <style> #divBox { width: 100px; height: 100px; background-color: yellow; border: 5px solid red; margin-top: 20px; } </style> <script> $(function() { $("#toggleBtn").on("click", function() { // id가 "divBox"인 요소를 빠르게(0.2초에 걸쳐) 올라가면서 사라지거나 내려오면서 나타나게 함. $("#divBox").slideToggle("fast"); }); $("#setBtn").on("click", function() { // jQuery.fx 객체의 speeds 프로퍼티의 fast의 기본값을 1초로 변경함. jQuery.fx.speeds.fast = 1000; }); }); </script> </head> <body> <h1>jQuery.fx.speeds 프로퍼티</h1> <button id="toggleBtn">이펙트 효과 토글!</button> <button id="setBtn">이펙트 효과 속도 변경!</button> <div id="divBox"></div> </body> </html>