jQuery 对多个元素进行动画处理，哪个更好？

发布于 2024-11-08 17:05:13 字数 518 浏览 0 评论 0原文

我在一个插件上使用 jQuery 动画函数，在许多元素上模拟，每个元素的持续时间不同。我想知道是否有动画正在运行或者是否根本没有动画。所以我想出了这个：

if( $div1.is(':animated') || $div2.is(':animated') || $div3.is(':animated') ) return true;
else return false;

或者这个：

if( $div1.add($div2).add($div3).is(':animated') ) return true;
else return false;

哪个更好？？？

你知道任何其他方法吗？？？

我不需要这个代码$("*").is(':animated');因为它会检查所有动画并来自其他插件动画。

请记住，我有很多元素，而不仅仅是 3 个。

感谢您的阅读...

原文

I am using jQuerys animate function on a plugin, on many elements simulatensly with different durations for each element. I want to know if any animation is running or if there is no animation at all. So i came up with this:

if( $div1.is(':animated') || $div2.is(':animated') || $div3.is(':animated') ) return true;
else return false;

or this:

if( $div1.add($div2).add($div3).is(':animated') ) return true;
else return false;

Which is better???

Do you know any other method???

I dont want this code $("*").is(':animated'); because it will check all animations and from other plugins animations.

Have in mind that I have many elements, not just 3.

Thanks for reading...

分享到QQ

分享到微博

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

发布评论

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

请帮我爱他 2024-11-15 17:05:13

我会选择第二个，因为它需要阅读和思考的代码更少。

一般来说，干更好。

您还可以重构...

return $div1.add($div2).add($div3).is(':animated');

I would go with the second as it is less code to read and think about it.

Generally, DRY is better.

You could also refactor that...

return $div1.add($div2).add($div3).is(':animated');

回复收藏 0 原文

别再吹冷风 2024-11-15 17:05:13

也许你可以在你想要检查动画的 div 上放置一个类？

if ($(".myclass").is(":animated")) return true;

Perhaps you could put a class on the divs you would like to check for animation?

if ($(".myclass").is(":animated")) return true;

回复收藏 0 原文

忆悲凉 2024-11-15 17:05:13

我可能会保持明确，以节省周期。每次设置动画时，都会增加 numberOfTotalAnimations。在动画回调结束时，将其递减。也就是说，如果您确实需要速度。除此之外，我喜欢@Ben 的课堂提案。

根据请求更新示例：

var numberOfTotalAnimations = 0;

numberOfTotalAnimations++;
$('#thing').animate({
    opacity: 0.1
  }, 2000, function() {
    numberOfTotalAnimations--;
  });

if (!numberOfTotalAnimations) {
  console.log("Everything's quiet.");
} else {
  console.log("Something's moving.");
}

它不漂亮，很容易出错（因为您可能忘记递增或递减计数器） - 但它很快。

I'd probably keep it explicit, to save cycles. Each time you animate, increment numberOfTotalAnimations. In the end of animation callback, decrement it. That is if you really need speed here. Otherwise, I like @Ben's class proposal.

UPDATE with an example, by request:

var numberOfTotalAnimations = 0;

numberOfTotalAnimations++;
$('#thing').animate({
    opacity: 0.1
  }, 2000, function() {
    numberOfTotalAnimations--;
  });

if (!numberOfTotalAnimations) {
  console.log("Everything's quiet.");
} else {
  console.log("Something's moving.");
}

It's not pretty, it's error-prone (in that you can forget to increment or decrement the counter) - but it's fast.

回复收藏 0 原文

~没有更多了~