SOLVED: Sticky sidebar in Post Page (elements stick & stay for some time)

Ask the community
,
1

Hey, I have an element pinned to the right corner of the page and is hidden on load. There’s a transparent strip. Now, I want the pinned element (hidden) to appear only while the transparent strip is on the screen and disappear once it’s not on the screen.

I don’t have much knowledge about coding. So I need help in achieving that.
Also, I think onViewportEnter( ) and onViewportLeave( ) might help in achieving this as told by someone from the Velo Team on this post.

722×366 22.5 KB

Thanks in advance.

2

Do you have already some code?

Ideed the idea of using a TRANSPARENT-STRIP can work.

$w('#myStripElement').onViewportLeave(()=>{ "WHAT TO DO HERE ???" })

“WHAT TO DO HERE ???” —> Hiding STRIP and showing Pinned-Element (for example a box)?

Not tested!

$w.onReady(()=>{
	$w('#myStripElement').onViewportLeave(()=>{ 
		$w('#myPinnedBoxElement').show('fade')
	 })
	//vice-versa-function.....
	$w('#myStripElement').onViewportEnter(()=>{ 
		$w('#myPinnedBoxElement').hide('fade')
	 })
});
3

Thanks a lot for your help! I had to change the code to this to make it work correctly.

$w.onReady(()=>{

    $w('#tranparentstripID').onViewportEnter(()=>{ 
        $w('#fixedelementID').show('fade')
 })
 //vice-versa-function...
        $w('#tranparentstripID').onViewportLeave(()=>{ 
        $w('#fixedelementID').hide('fade')
 })
});

Now, the issue of the sticky sidebar (like WordPress) in Wix seems to have resolved. I’ll soon publish the changes on my post pages. 造作家具とは？｜詳しく知りたい造作家具　2023年8月更新

Good luck,
Tube Relevant.