jQueryでfirefoxで自動計算されたマージンを取得

Question

以下のマークアップとCSSを使用して、計算されたシェルの左マージンを取得しようとしました。

<section class="page-title"> 
     <div class="shell"> 
     <h5 class="title">Welcome!</h5> 
     </div> 
    </section> 

.shell { 
    zoom: 1; 
    max-width: 1000px; 
    margin-left: auto; 
    margin-right: auto; 
    padding-left: 16px; 
    padding-right: 16px; 
} 

それはクローム、サファリ、IE9で動作しますが、驚くほどFirefoxで動作しません

parseInt($('.shell').css('marginLeft')) 

を使用します。他のアプローチを試みました：

($('.shell').outerWidth(true) - $('.shell').outerWidth())/2 

Firefoxでもうまくいきます。だから、firefoxはjQueryで未定義のCSSを取得することをサポートしていないと思いますか？これを回避するには、次の方法があります：

($('.page-title').width() - $('.shell').outerWidth())/2 

しかし、もっと良い方法があるのだろうかと思います。

Answer 1

あなたはそれがうまくいかないと言うと、（コンソールで）エラーを受け取るか、それとも0を返しますか？自動設定で0を返すことは、明らかに異なるブラウザで問題になります。

すべてのメトリックをピクセル単位で返す軽量のjSizesライブラリを使用できます。これにより、outerWidthなどで慌てる必要がなくなります。