3

http://jsfiddle.net/MeoMix/8zg2V/83/

次のjsFiddleがあります。長すぎるコンテキスト メニュー項目が表示されると、省略記号が表示されますが、マウスオーバーするとテキストがパンされます。

問題のコード:

//Provides helper methods for non-specific functionality.
define('helpers', [], function () {
    'use strict';

    return {
        scrollElementInsideParent: function(element, parent) {
            //  Scroll the element if its too long to read.
            $(element).mouseover(function () {

                var distanceToMove = $(this).width() - $(parent).width();

                console.log("My width and parent width:", $(this).width(), $(parent).width());

                $(this).animate({
                    marginLeft: "-" + distanceToMove + "px"
                }, {
                    //  Just a feel good value; scales as the text gets longer
                    duration: 15 * distanceToMove,
                    easing: 'linear'
                });

            }).mouseout(function () {
                $(this).stop(true).animate({ marginLeft: 0 });
            });
        }
    };

ここでは、スクロールされている要素の幅とその親の幅をログに記録します。コンソール出力:

私の幅と親の幅: 360 230

しかし、これはメトリクスを見ると正しくないようです:

ここに画像の説明を入力

どうしてこれなの?

4

1 に答える 1