728x90
queue() 메서드는 큐에 적용된 애니메이션 함수를 반환하거나 큐에 지정한 함수를 추가하며, 실행하면 실행 이후의 모든 애니메이션이 취소된다.
dequeue() 메서드는 실행 이후 적용된 애니메이션 메서드가 취소되지 않게 연결해준다.
* 예제
| <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title> 효과와 애니메이션 </title> <script src="js/jquery.js"></script> <script> $(function(){ $(".txt1") .animate({marginLeft:"200px"},1000) .animate({marginTop:"200px"},1000) .queue(function() { $(this).css({background:"red"}); $(this).dequeue(); //dequeue() 메서드를 생략하면 queue()메서드 이후의 애니메이션이 적용 되지 않는다. }) .animate({marginLeft:0},1000) .animate({marginTop:0},1000); }); </script> <style> *{margin:0;} .txt1{width:50px;text-align: center;background-color: aqua;} </style> </head> <body> <p class="txt1">내용1</p> </body> </html> |
'내마음대로만들어보자 > JS' 카테고리의 다른 글
| 자바스크립트 객체 (0) | 2021.08.30 |
|---|---|
| clearQueue() 메서드 (0) | 2021.08.25 |
| stop() / delay() 메서드 (0) | 2021.08.25 |
| animate() 메서드 (0) | 2021.08.25 |
| fadeTo() 메서드 (0) | 2021.08.25 |
