How To Add A Margin Top When Image Is Rotating With Js

I want to add margin to the top of the image when it is rotated by 90 degrees. This is how I rotate the image: const img = document.querySelector('#mocci-logo') document.addEventL

Solution 1:

Try this:

const img = document.querySelector("#mocci-logo")

document.addEventListener("scroll", (e) => {
  if(!window.scrollY) {
    img.style.transform = "rotate(0deg)"
    img.style.marginTop = "0px"; // This can also be 0 or "0".
  } else {
    img.style.transform = "rotate(-90deg)"
    img.style.marginTop = "60px";
  }
})