Okay i have a full page scroll project , everything works fine and beautiful on firefox except this Chrome..I have an element which translate on wheel event, so there is no actual scrolling.The element's CSS is

```
#trasnlateMe {
    height: calc(var(--vh) * 400);
    width: 100%;
    overflow: hidden;
    position: relative;
    transition: transform 1s cubic-bezier(0.5, 0, 0.5, 1);
}

```

and it has inline styling of 

```
style="transform:translateY(0);"

```

on my js at beginning of code I have this code also.

```
let container = document.querySelector("#trasnlateMe");
container.style.transform = "translateY(0)";

```

basically when you scroll i get the direction through a flag and translate the page by this function.

```
const fullPageScroll = () => {
  containerHight = window.innerHeight * foldQuantity;
  yTrasnlationOfContainer = parseInt(
    container.style.transform.replace("translateY(", "")
  );
  if (
    (scrollDirection === "down" &&
      Math.abs(yTrasnlationOfContainer) <
        containerHight - containerHight / foldQuantity) ||
    (swipeDirection === "up" &&
      Math.abs(yTrasnlationOfContainer) <
        containerHight - containerHight / foldQuantity)
  ) {
    yTrasnlationOfContainer = yTrasnlationOfContainer - window.innerHeight;
  }
  if (
    (scrollDirection === "up" && yTrasnlationOfContainer < 0) ||
    (swipeDirection === "down" && yTrasnlationOfContainer < 0)
  ) {
    yTrasnlationOfContainer = yTrasnlationOfContainer + window.innerHeight;
  }

  if (holder === false && hambergurMenu.style.display !== "none") {
    holder = true;
    swipeDirection = null;
    container.style.transform = `translateY(${yTrasnlationOfContainer}px)`;
    for (let i = 1; i <= foldQuantity; i++) {
      if (yTrasnlationOfContainer === -(window.innerHeight * (i - 1))) {
        currentSection = i - 1;
      }
      fillRelatedCircle();
      setTimeout(() => {
        holder = false;
      }, 1000);
    }
  }
};
    //Handling wheel event of the whole page
    container.addEventListener("wheel", event => {
      if (event.deltaY > 0) {
        scrollDirection = "down";
      }
      if (event.deltaY < 0) {
        scrollDirection = "up";
      }
      event.stopPropagation();
      fullPageScroll();
    });

```

so everything works lovingly on firefox but chrome decided not to set the ytrasnlation of #trasnlateMe to 0, the abnormal thing is that it does on paper, when you look at the code after refresh it looks like this >> style="transform:translateY(0); but it stays at the same section which was before the refreshing on the viewport and the whole scrolling GETS BROKEN, IT COUNTS THE SECTION WHICH WAS BEFORE REFRESHING ON the VIEWPORT AS THE FIRST SECTION.

Please help this is so annoying.

Just NOTE: when I close the tab and open the html file again everything works beautifully on Chrome, even if you don't have an answer for this bug would you tell me what can I do to mimic that same behavior on reloading? That everything be like the page is opened right now.That would fix it too.