一次为一个轴动画 jQuery Masonry 元素答案

【问题标题】：Animating jQuery Masonry elements one axis at a time一次为一个轴动画 jQuery Masonry 元素
【发布时间】：2013-09-23 08:21:10
【问题描述】：

我有一个 jQuery Masonry 布局，我正在初始化，如下所示：

$("#container").masonry({
    itemSelector: ".pod, .smallpod",
    animationOptions: {
        queue: true
    }
});

我认为queue 选项会将动画排队，以便它首先为x 设置动画，然后是y。事实证明这是不对的。

有人知道这是否可能吗？我已经查看了 Unminified jQuery Masonry JS，但找不到需要更改的地方。

我找到了 moveTo() 和 transitionTo() 函数，但我不确定要更改什么。

在translate() 函数中有：

function( x, y ) {
    return 'translate3d(' + x + 'px, ' + y + 'px, 0)';
} :
function( x, y ) {
    return 'translate(' + x + 'px, ' + y + 'px)';
};

但是，我找不到一种方法来一次只为一个轴设置动画。

【问题讨论】：

【解决方案1】：

原来你可以在 CSS3 中做到这一点 - 所以，我正在回答我自己的问题..

1) 将transitionDuration 设置为0

2) 新增转场属性left, top, opacity

【讨论】：

【解决方案2】：

首先，您可以独立检查两个轴。变量 didnotmoved 等于两个轴。创建第二个变量，然后进行 2 个 if 语句来递增或递减 x 或 y 轴。

【讨论】：

简单地说将 1 个变量变为 2 个变量并不构成答案，尤其是在 jQuery Masonry 的上下文中（大量代码）。抱歉......简而言之，这个答案实际上并没有帮助。如果您编辑更多详细信息，很高兴为您投票：/