使用jQuery获取firefox中的自动计算边距

Question

使用下面的标记和CSS,我试图获得计算的shell左边距.

 <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;
}

运用

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

它适用于Chrome,Safari,IE9,但令人惊讶的是在Firefox中不起作用.尝试了另一种方法:

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

同样适用但Firefox.所以我猜火狐不支持用jQuery获取未定义的CSS？解决这个问题的直接方法是:

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

但我想知道是否有更好的方法.

Answer 1

当你说它不起作用时，你会收到错误（在控制台中）还是返回 0？显然，不同浏览器的自动设置返回 0 是一个问题。

您可以使用轻量级jSizes库，它以像素为单位返回所有指标。这将使您不必浪费时间使用outerWidth等。