css - 有没有办法定位 img 标签对象位置 x 和 y？

Question

我已经包含了我的 codepen 作为示例。我需要让图像随光标移动。是否有像 object-position Y 这样的属性或我可以使用的东西？

我知道我可以做背景位置 x 或 y ，但为什么不做对象位置 X 或 Y 呢？

图像悬停效果

const images = document.querySelectorAll('.image');

images.forEach((image) => image.addEventListener('mousemove', (e) => {

image.style.objectPosition = -e.offsetX + "px"<--works but I want both directions??


  //image.style.objectPositionX = -e.offsetX + "px"//why cant i do these?
  //image.style.objectPositionY = -e.offsetY + "px"
}));

标签： cssimagepositionoffsetobject-position