Streaming live at 10am (PST)

How to create a slider that sticks on scrolling

Is there a way to create a featured slider that sticks to the page while scrolling and only scrolls one side of the slider?

This shopify template has the exact features I am looking for.

You can read more about it on the this link https://www.shopify.com/partners/blog/building-narrative-shopify-s-new-theme-for-storytelling (Featured Slider Section.

Best Regards,
Adriano

Hey @adrianosg

It’s 100% possible! In order to create a section that remains fixed on one side and scrolls on the other, you need to use position: sticky

Here’s a tutorial on how to use it: https://www.youtube.com/watch?v=qM9oPp_eDR0

I think watching this video should pretty much explain it all. One side has position sticky, while the other side scrolls from top to bottom normally. Let me know if that helped.

Cheers,
Aditya

Slider is quite trending feature on websites nowadays, It helps user’s to navigate easily. If you are working on wordpress it’s easy to do by using plugins.
But if your website is coding based then you have to work with HTML, CSS, JAVASCRIPT. For you can take reference from this post :- https://www.w3schools.com/howto/howto_js_sticky_header.asp