0

我无法使用 YUI3 创建动画滚动。

它应该与 iOS 惯性滚动兼容，我想以编程方式触发动画滚动。但是由于缺少文档，我找不到 YUI3 的正确语法。

1）以下代码有效：

   scrollArea._node.scrollLeft = 200; //the element is scrolled!
   // so the variable is defined correctly and CSS also works!

2）以下代码也有效（如果我使用绝对定位来模拟滚动）：

        animation = new Y.Anim({
            node: content,
            to: {
                left: -200
            }
        });
        animation.run();

3）但以下没有：

        animation = new Y.Anim({
            node: scrollArea,
            scroll: {
                to: {
                    scrollLeft: 200
                }
            }
        });
        animation.run();

4）这是标记的样子：

<div class="scroll-area"> <!-- scrollArea, overflow: scroll -->
    <ul class="content"> <!-- content -->
        <li></li><li></li><li></li>
    </ul>
</div>

我希望这仅仅是语法问题。 到这里，YUI2 的问题就解决了

4

1 回答 1

0

在第三个示例中，问题似乎是您将scroll其用作 Anim 构造函数的属性，这对于 YUI2 的 Scroll 实用程序的工作方式是有效的，但YUI3 的 Anim比这更强大。

你在第二次尝试时很接近。这是修改后的代码：

    animation = new Y.Anim({
        node: scrollArea,
        to: {
            scrollLeft: 200
        }
    });
    animation.run();

我已将该scrollLeft字段移动到to 属性中，并将节点更改为scrollArea而不是content. 如果您打算经常执行这种动画滚动操作，那么我建议您创建一个重用单个 Anim 对象的包装函数。此示例可能对您演示此类重用有用。祝你好运。

于 2012-12-30T14:49:43.947 回答