Sticky sidebar in parent (or between two anchors)

Ask the community
,
1

Hey there!

Since I’m really new to Wix Code and Javascript, I was hoping to get an answer here in the forum. I’m looking for a code to make an element sticky inside the parent element or between two anchors. So, once you scrolled to a specific height, this element should become fixed.

Here, you can see an example of what I mean: https://codepen.io/tutsplus/pen/pJRRKW

Is there any way to achieve this?

I’m really looking forward to your response!!

2 Likes
2

Hi,
You can simply pin element to screen as explained here . No code is needed :slight_smile:

Best,
Tal.

3

Hi Tal,

thanks for your answer. Unfortunately you didn’t get my right. I know how to pin elements. But I don’t want to pin it on the whole page but just in between of two anchors or inside an element as you can see in my example here.

Thanks in advance.

4

Hi,
You can do the following:

  1. Add a box, pin it to screen and set it to be hidden on load .
  2. Add a transparent strip and add a viewportEnter and viewportLeave events.
  3. On the viewportEnter event, show the box.
  4. On the viewportLeave , hide the box.

You can play with the locations of the box so that it works as you wish. Adding the anchors does not necessarily need to be related to the box.

Good luck,
Tal.

5

Hi,

I’m trying to do the same but I have no success.
Wix should know how to do it because in their own websites they have all of these effects, here is an example: https://www.wix.com/blog/2015/08/how-to-create-an-impressive-long-scrolling-website/

1680×951 283 KB

Look the purple box behavior

Here is another example of what i’m looking https://heygents.com.au/

1680×951 288 KB

6

Yes, this is exactly what I am looking for!

7

Hi everyone,

as i see the post is 3 month old, does anyone here managed to achive the result?

Thank you :wink:

8

Hi, I know this is an old post, but I want to use this feature one of my dynamic item pages with anchors. Is there a way to deal with this?