jquery CSS 在 webkit 中不起作用

Question

如果图像是纵向的，我正在尝试将一些 css 应用于图像标签，但由于某些原因，.css() 在 webkit 中不起作用。基本上图像标签没有获得“样式”属性。这是我的代码:

$(document).ready(function () {

    $('.listing .item .thumb img').each(function () {

          var _img = $(this);
          var _imgWidth = _img.outerWidth();
          var _imgHeight = _img.outerHeight();

          if (_imgHeight > _imgWidth) {
               _img.css('top', '-40%');
          }
    });
});

<div class="listing about">
    <div class="item">
        <a href="#" class="thumb">
            <img src="../_uploads/siteassets/images/thumb-carousel-2.jpg" />
            <span class="frame"></span>
        </a>
        <span class="snippet">
            <a href="#" class="title">Name Surname</a>
            <span class="date">Role in the company</span>
            <p class="description">Lorem ipsum dolor sit amet...</p>
        </span>
    </div>
</div>

我试过使用 .attr() 而不是 .css() 但没有用。这是行不通的!

知道为什么吗？

Answer 1

当 .ready() 被触发时，图像可能没有设置尺寸。

0 > 0 为假，因此永远不会设置 top 属性。

使用$(window).load();相反，或者 this plugin .