[web][jquery][jquery-ui] jquery color관련 animation 사용하기 jquery-ui.js

jquery를 사용하면 js를 사용해서 복잡한 애니메이션 조금 더 간편하게 구현할 수 있습니다.

그런데, jquery만 가지고는 하지못하는 애니메이션들이 있습니다. 대표적인 예로 color속성이 있습니다.

예를들어 이러한 js코드가 있습니다.

$(".remote .category").children("a").eq(0).animate({
        fontSize: "1.5em",
        color: "white"
})

위의 코드는 어떤 DOM객체에 fontSize와 color를 변경하는 애니메이션입니다.

단순 jquery만을 로드한채라면 저 애니메이션은 예상한대로 동작하지 않습니다.

fontSize만 증가하고, color는 변화가 없을 것입니다.

이때 필요한 것이,  jquery-ui입니다.  https://jqueryui.com/

별도의 코드 수정없이, jquery-ui를 추가로 로드한뒤, 다시 실행해본다면 예상한대로 잘 동작할 것 입니다.

이 jquery-ui는 jquery에 종속적이기 때문에, jquery를 먼저 로드한뒤, jquery-ui를 로드하여 사용하여야 합니다.

<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>