[JavaScript] jQuery의 애니메이트

개발log·2024년 1월 10일

HTML&CSS&JavaScript

목록 보기
7/7
post-thumbnail

애니메이트

선택자.animate({속성:값, 속성:값}, 시간, 이징, 다른 할일);

<script src="../fff/js/jquery-3.7.1.min.js"></script>
<script> $(function(){
  $('#id.inner).click(function(){
    $(this).animate({opacity:0, fontSize: '0px'},1500);
  });

✏️ 애니메이트 : 수치가 바뀌는 것만 가능

이징함수

👇 이징함수 볼 수 있는 곳 👇
https://api.jqueryui.com/easings/

swing

기본값으로 제공되는 이징함수
시작 부분에서는 조금 빠르게, 중간 부분에서는 느리게, 종료 부분에서는 다시 빠르게 진행되는 가속-감속 효과를 가지고 있다.

linear

일정한 속도로 애니메이션을 진행

다른 할일

function(){실제 할일} //임의 함수(익명함수)

profile
나의 개발 저장소

0개의 댓글