2

我正在使用 object-fit 和 object-position css 属性来控制图像在 css 中的位置。我想用 javascript 以编程方式设置该位置。我试过了：

const panPos = 50;
document.querySelector('.image').style.objectPosition = `${panPos}% 0%`;

什么也没有发生。

我可以控制台记录 element.style 并且我看到一个 objectPosition 属性，但设置它似乎没有效果。

请注意，我不是在谈论position属性（绝对属性、相对属性等）。

我还可以使用 jquery 设置此属性：

$('.image').css({
      'object-position': `${panPos}% 50%`  
    });

但我想避免使用 jQuery。有任何想法吗？

4

1 回答 1

1

您也需要设置object-fit为none。它们一起使用，否则object-position将被忽略。所以：

const panPos = 50;
document.querySelector('.image').style.objectFit = 'none';
document.querySelector('.image').style.objectPosition = `${panPos}% 0%`;

有关更多信息，请参阅：

于 2018-01-26T00:42:06.670 回答