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

3番目の例では、問題scrollはAnimコンストラクターの属性としての使用にあるように見えます。これは、YUI2のScrollユーティリティの動作に有効ですが、YUI3のAnimはそれよりもはるかに強力です。

あなたは2回目の試みに近づきました。改訂されたコードは次のとおりです。

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

scrollLeftフィールドをto属性に移動し、ノードをscrollAreaの代わりにに変更しましたcontent。このアニメーション化されたスクロール操作を頻繁に実行する場合は、単一のAnimオブジェクトを再利用するラッパー関数を作成することをお勧めします。この例は、そのような再利用を示すのに役立つ場合があります。幸運を。

于 2012-12-30T14:49:43.947 に答える