jquery - 使用 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 除外。所以我猜firefox不支持用jQuery获取未定义的css？解决这个问题的一个直接方法是:

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

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

Answer 1

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

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