2

jQuery.ScrollToプラグイン(http://demos.flesler.com/jquery/scrollTo/)と同じように、アンカーリンクをクリックしたときにページをスムーズにスクロールするアニメーションを作成したいと思います。

プロパティの値をアニメーション化して、YUI2.xAnimationユーティリティを使用して作成してみましたdocument.activeElement.scrollTop。Webkitでのみ機能します:'(-他のブラウザでは何も起こりません-エラーも発生しません。

goToAnchor = function(e, id) {
    var targetToGo = Dom.get(id),
        scrollToTarget = new Animation(document.activeElement,
            {
                scrollTop:
                {
                    from: document.activeElement.scrollTop,
                    to: targetToGo.offsetTop
                }
            },  1,  Easing.easeOut
        )
    Event.preventDefault(e);

    scrollToTarget.animate();
}

私が知りたいのは、YUI 2.xでこれを行うプラグインがあるかどうか、またはクロスブラウザー互換のコードを実行する方法です。

ありがとう!

4

2 に答える 2

2
<script>
(function() {
  var scrollingBody = document.body;
  if (YAHOO.env.ua.gecko){
    scrollingBody = document.documentElement;
  }
  (new YAHOO.util.Scroll(
    scrollingBody,
    {
        scroll:
        {
            to: [0, 50]
        }
    },
    0.7,
    YAHOO.util.Easing.easeOut
)).animate();
})();
</script>
于 2012-11-08T12:54:33.100 に答える
2

htmlブラウザによっては、またはbody要素をスクロールする必要がある場合があることに注意する必要があります。

実際には、確実に両方をスクロールする必要があります

また、http://developer.yahoo.com/yui/animation/#scrollで私は見る

var element = document.getElementById('test');
var myAnim = new YAHOO.util.Scroll(element, {
    scroll: {    
        to: [ 500, test.scrollTop ]
    } 
});
myAnim.animate();

多分それはあなたが探しているものです(それでもあなたは両方htmlbodyをアニメートする必要があります)

于 2012-11-08T12:52:51.937 に答える