Show and hide image when text reaches the center of viewport?

Hi, so i know you can set code to show and hide images on text onviewportenter and onviewportleave. But is there a way to trigger show and hide when text reaches a certain point on the viewport? For example when text reaches the center?, i also want to hide image when the same text exits the center of the viewport.

Perhaps this could be used to solve your problem, but not sure…

https://www.wix.com/corvid/reference/wix-window/getboundingrect

Hi Dima,

thanks for the advice, it might be a good starting point. Im totally new to html but essentially what i wanna do is sort of like

’strip1’ onscrolloffset x= 500px
‘image1’ show
’strip1’ onscroll offset x =/= 500px
’image1” hide

any idea how i can write that properly ( ._.)/

Using the Y-Axis would be no problem, you could use “scrollTo”, but to do it in X-axis, it`s a little big more difficult.

I do not know if this is possible, perhaps you take also a look at this…

oh my gosh!

i totally meant the y-axis Dima! so to get this right;

“strip1” scrollTo = 500px
“image1” show
?

would that be right?

@firmanangid
Yes, you are on the right way…

import wixWindow from 'wix-window';

export function myButton_click(event) {
  
  wixWindow.scrollTo(100, 1200)
    .then( ( ) => {
      console.log("Done with scroll");
      $w('#image1').show()
  });
}