ArticlesBlog

How to Make a Row Sticky with Visual Composer

How to Make a Row Sticky with Visual Composer


Hi, everyone! It’s Irma here. And in this video I’m going to walk you through the sticky row options I have a layout here already. Time to add some stickiness to it. Let’s say I want the speaker to be visible on the screen while I scroll through the features on the sides. As this is a container, let’s open the column the image is in. Once that’s done, here at the bottom is the stickiness toggle. Now that stickiness is enabled, it opens the stickiness parameters. Our image is sticky already, as you can see, but there are some things we can do to adjust it. First is margin top. Here you can adjust where the object is going to stick. At the moment the image is sticking to the top, but I want it to be visible lower. So 100px should do the trick. Much better. Next option is the z-index. That allows you to define the depth of the element or simply whether the element is going to go over or under the next section. Next, there’s the toggle that allows you to apply the sticky option only within the parent element. Like here for example the image goes under the next section, but I want it to stay above it. So now, when I enable the toggle, it will move only within the section it’s in. And this has been the overview of sticky row. Thank you all for watching and enjoy!

Comments (5)

  1. LUV IT!! Does it do anything on mobile view? 🙌🏻⚡️📱

  2. Do we have this option is WPBakery?

  3. Wonder why this is not in WPBakery?

  4. I couldn't find that sticky column option in my visual builder. Any one let me know how can i visable?

  5. I just want to stick it at the bottom on mobile. How can I do that?

Comment here