0

jQuery 的动画引擎不适合我。它没有内置缓动和彩色动画,而且我为它们使用的插件不能始终如一地正常工作。

过去我对 YUI 的动画引擎有很好的体验。是否可以使用 jQuery 选择项目,然后使用 YUI 为它们设置动画?这是我当前的 jQuery 动画代码,用于在您单击 div 时对其进行动画处理:

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

我将如何将此函数中的动画转换为 YUI3?

(这甚至是个好主意吗?我是否应该将所有内容都转换YUI3、选择器和所有内容?另外,如果这是一个愚蠢的问题,请原谅我,我是菜鸟)

4

2 回答 2

1

这些 javascript 库的部分好处是您可以在较少的代码中获得大量功能。通过同时包含 JQuery 和 YUI,您可以快速增加页面的大小。

如果您使用 jquery 的唯一目的是选择 DOM 中的元素,那么一定要转换为 YUI,因为它有许多相同的选择方法。如果您同时使用多个 jquery 和 YUI,那么混合它们可能是您现在必须忍受的。

于 2010-07-03T11:24:41.303 回答
0

如果您正在为单个元素设置动画,则可以执行以下操作:

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,YUI 不支持开箱即用的多个元素的动画,尽管您可以使用补间事件来实现它。

但是,我怀疑您最好使用jQuery UI。它提供彩色动画和高级缓动。

于 2010-07-06T16:40:29.517 回答