Is it possible to set the diff resizer position?

[enddevNZ]

By default, even looking at examples on the docs the resizer control is slightly offset to the left.

When trying to use this as hero feature on home page, full screen width on desktop, the resizer sits too much to the left on load.
It makes it hard to set text properly on the diff-item-1 to make it show as "cut-off"

would be good if could adjust the position on load.

[saadeghi]

There are a lot of issues with the method used for diff.
I'm working on a different method which would bring more control and better browser support.

[enddevNZ]

Ah no worries, thanks for the quick reply

[bolopenguin]

There is some news?

[melkishengue]

as a workaround you can set the width with javascript

const initSlider = function() {
  if (!window.sliderInitialized)  {
    window.sliderInitialized = true

    const image = document.getElementById("img-1")
    if (image) {
      try {
        const width = parseInt(image.width);
        const slider = document.getElementById("slider")
        slider.style["width"] = (width/2) + "px";
      } catch (error) {
        console.error("error while setting the initial width")
      }
    }
  }
}

<div class="diff aspect-[16/9] rounded-xl overflow-hidden m-32">
	<div class="diff-item-1">
		<img alt="daisy" id="img-1" src="https://example.com/img-1.png" />
	</div>
	<div class="diff-item-2">
		<img
			alt="daisy"
			id="img-2"
			src="https://example.com/img-2.png" />
	</div>
	<div class="diff-resizer" id="slider"></div>
</div>