0

I have included my codepen for an example. I need to have the image move around with cursor. Is there an attribute like object-position Y or something that i can use?

I know i could do background-position x or y , but why not object-position X or Y?

image hover effect

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"
}));
lache
  • 608
  • 2
  • 12
  • 29
  • I'm not quite clear what your question is. You can't use objectPositionX (or Y) because they don't exist AFAIK. objectPosition though can take two values (x then y). – A Haworth Oct 21 '21 at 20:45
  • Ok so I noticed that it does take both, its just the effect does not work still when i try to implement it. but i think thats the right direction. – lache Oct 21 '21 at 22:36

0 Answers0