incorrect placement of elements after resizing

lax.js version v2.03

here is an example to reproduce the issue :

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <style>
    .space {
      height: 1000px;
    }

    .content {
      display: flex;
      height: 200px;
    }

    .static {
      background-color: green;
      flex: 1;
    }

    .dynamic {
      background-color: red;
      flex: 1;
    }
  </style>
</head>

<body>
  <div class="space"></div>
  <div class="content">
    <div class="static">Hello</div>
    <div class="dynamic">world</div>
  </div>
  <div class="space"></div>
  <script src="lax.js"></script>
  <script>
    lax.init();
    lax.addDriver("scrollY", function () {
      return window.scrollY;
    });
    lax.addElements(".dynamic", {
      scrollY: {
        translateY: [
          ["elInY", "elCenterY", "elOutY"],
          ["screenHeight/2", 0, "-screenHeight/2"]
        ],
      }
    });
  </script>
</body>

</html>

if you load the script, every thing is fine, but if you go back to the top of the document, resize the window horizontally and return to the 2 blocks, they are no longer aligned

Describe the bug

When the boundingClientRect is called, lax.js does not check if he have already assigned a value to it that will interfere with its initial value. if this is the case, the value retrieved in bounds will be wrong. https://github.com/alexfoxy/lax.js/blob/5abe2aaed551394c31748169f6c42fc9159361d8/src/lax.js#L463

Code a solution could be :

let saveTransform = this.domElement.style.transform;
this.domElement.style.removeProperty("transform")
const bounds = this.domElement.getBoundingClientRect()
this.domElement.style.transform = saveTransform;

but it does not cover all cases

thank you for your library !!

alexfoxy / lax.js

incorrect placement of elements after resizing #157