使用jQuery进行选择，然后使用YUI进行动画？好主意吗？

发布于 2024-09-07 22:02:00 字数 569 浏览 7 评论 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);  
});

How would I go about Converting the Animations in this function to YUI3?

（这是个好主意吗？我应该将所有东西都转换为 YUI3、选择器等等吗？另外，如果这是一个愚蠢的问题，请原谅我，我是个菜鸟）

原文

jQuery's animation engine isn't working well for me. It doesn't have easing and color animation built-in, and the plugins I am using for them don't work properly together consistently.

I've had good experience with YUI's animation engine in the past. Is it possible to use jQuery to select items, and then use YUI to animate them? Here's my current jQuery-animated code to animate a div when you click it:

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

How would I go about converting the animations in this function to YUI3?

(Is this even a good idea? Should I just convert everything to YUI3, selectors and all? Also, if this comes across as a dumb question, forgive me, i'm a noob)

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

や莫失莫忘 2024-09-14 22:02:00

这些 JavaScript 库的部分好处是您可以用更少的代码获得大量的功能。通过包含 JQuery 和 YUI，您可以快速增加页面的大小。

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

回复收藏 0 原文

猫九 2024-09-14 22:02:00

如果您要对单个元素进行动画处理，则可以执行以下操作：

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();
    });
});

据我所知，YUI 不支持开箱即用的对多个元素进行动画处理，尽管您可以使用补间事件来实现它。

不过，我怀疑您最好使用 jQuery UI 。它提供彩色动画和高级缓动。

If you are animating a single element, you can do something like this:

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 does not support animating multiple elements out of the box, though you could implement it using the tween events.

I suspect you are better off using jQuery UI, however. It provides color animation and advanced easing.

回复收藏 0 原文

~没有更多了~