jQuery를 사용하여 선택한 다음 YUI를 사용하여 애니메이션을 만드시겠습니까? 좋은 생각?

Question

jQuery의 애니메이션 엔진이 제대로 작동하지 않습니다. 그것은 easing 및 컬러 애니메이션이 내장되어 있지 않으며, 내가 사용하고있는 플러그인이 일관되게 함께 제대로 작동하지 않습니다.

예전에 YUI의 애니메이션 엔진에 대한 좋은 경험을했습니다. jQuery를 사용하여 항목을 선택한 다음 YUI를 사용하여 애니메이션을 만들 수 있습니까?

$("div.article").mousedown(function() { 
    $(this).children(".box").animate({height:'+=100px', paddingTop: '24px'},300); 
    $(this).children(".box").children(".subBoxA").show().animate({opacity: "1"}, 500); 
}); 

가 어떻게 YUI3이 기능에 애니메이션을 변환하는 방법에 대한 갈 것이라고 : 여기를 클릭 사업부 애니메이션을 내 현재 jQuery를 애니메이션 코드는?

(이도 좋은 생각인가? 난 그냥 모든 것을 변환해야 YUI3, 셀렉터 모든? 또한,이 바보 같은 질문으로 가로 질러 온다면, 용서, 내가 해요 멍청한 놈에)

Answer 1

, 당신은 같은 것을 할 수 있습니다.

그러나 jQuery UI을 사용하는 것이 더 낫다고 생각합니다. 컬러 애니메이션과 고급 이징을 제공합니다.

Answer 2

이러한 자바 스크립트 라이브러리의 장점 중 일부는 적은 양의 코드로 많은 기능을 사용할 수 있다는 것입니다. JQuery와 YUI를 모두 포함하면 페이지 크기가 빠르게 증가합니다.

jquery를 사용하는 유일한 방법은 DOM에서 요소를 선택하고 동일한 선택 방법이 많은 YUI로 변환하는 것입니다. jquery와 YUI의 여러 조각을 사용하는 경우, 이들을 혼합하면 현재 살고있는 것일 수 있습니다. 당신은 트윈 이벤트를 사용하여 구현할 수 있지만 YUI는, 상자 밖으로 여러 요소 애니메이션을 지원하지 않습니다

YUI.use("anim", function (Y) { 
    $("div.article").mousedown(function() { 
     var el = $(this).children(".box")[0], 
      anim; 
     anim = new Y.Anim({ 
      node: el, 
      /* animation configuration */ 
     }); 
     anim.run(); 
    }); 
}); 

AFAIK : 단일 요소를 애니메이션하는 경우