Discover the best sliders websites created by professional designers. Get inspired and start planning your perfect sliders web design today!

Reverse engineered version of Webflow's very own sticky section component found here: https://webflow.com/solutions/freelancers-agencies.  

Details:
- It's using a proxy div (4x) to call the 'Scroll In/Out of View' interactions
- There is custom code in the footer used for video playback controls (starting/stopping video at specific time based on scroll position)
- 100% credit to Webflow team for design and original implementation

Webflow Sticky Sections (Public)

Webflow Sticky Sections

A WebGL prototype showcasing some amazing artwork by StudioJQ. Just press and drag to explore.

The code is based on an awesome project by creative developer Daniel Velasquez and it is modified to more easily integrate with Webflow.

Original Repo: https://github.com/Anemolo/StickyImageEffect

* You can update the Text, Links, and Images in footer (via page settings).
* Easily modify the effects speed, frequency, etc. in footer (via page settings). 
* I have not done thorough testing so please comment with any feedback and/or issues. 
* All images are subject to Copyright © 2019 ∆ Studio–JQ ∆ (https://dribbble.com/STUDIOJQ)

Update 10/16/19: 1) Clicking links now works on mobile and will no longer activate the sticky effect across all devices.

Sticky Image Showcase

New cyberspace transmission detected. Please intercept and initiate visual scan...

The concept behind this website is that you 'Add to Cart' the different web elements you require to build your new website before checking out to open the contact form. No real products or transactions involved! The 3D images are modeled and rendered in Blender. Also includes a Sketchfab embed to view the 3D model. Thanks for looking! :-)

Web Elements

Web Elements 3D

The project was made to help a forum question > https://forum.webflow.com/t/rotating-text-in-a-sentence/76920

Changing words in a sentence

Playing with some code from CodePen > https://codepen.io/waaark/pen/VbgwEM

Liquid Button

Liquid button

Architecture slider

Architecture Slider

Let's work with the hover state in daily interaction #8!

This demo showcases an image panel reveal using flexbox and hover states.

To view more daily interactions and premium content visit: https://www.webdevforyou.com/

WebDev for You - Daily Interaction #8

WebDev For You - Daily Interaction #8

I wanted to practice my webflow skill and decide to share to the community :)
Cms / Grid 2.0 / Flexbox / Animation...
I focused on desktop version.
Credits to : http://martinmroc.dribbble.com/

Architects

Presentation rooms / architecture

This demo showcases a grid of images that move left to right on scroll. Smooth scrolling has also been added via the luxy.js script.

Inspired by this Codrops demo: https://tympanus.net/Development/TileScroll/

WebDev for You - Interaction #150

WebDev For You - Interaction #150

Follow me to be warned of the future stocks  👌.

Webflow interactions stock

Stock Animations N°1

Example of using the 'tab change' interaction trigger to animate elements within both the Tab Link and Tab Pane when a tab is selected!

NOTE! Any interactions happening within the Tab Pane must start after any interactions within the Tab Link are finished, otherwise the tab component will cut off the animation resulting in nothing happening in the Tab Pane. 👍

Tab Change Interaction

Hey! 👋

Here's a cloneable testimonial section that you can add to your own websites and style as you please. This component has a guide attached that will show you how to add custom slider arrows into your own slider elements. Learn how to add your own custom arrows here:

https://www.flowbase.co/guides/custom-arrows-on-webflow-slider

⁃⁃⁃⁃

🥰 Support Us:

𝙄𝙛 𝙮𝙤𝙪 𝙚𝙣𝙟𝙤𝙮 𝙤𝙪𝙧 𝙘𝙤𝙣𝙩𝙚𝙣𝙩, 𝙥𝙡𝙚𝙖𝙨𝙚 𝙘𝙤𝙣𝙨𝙞𝙙𝙚𝙧 𝙨𝙪𝙥𝙥𝙤𝙧𝙩𝙞𝙣𝙜 𝙪𝙨 𝙤𝙣 𝙤𝙪𝙧 𝙨𝙤𝙘𝙞𝙖𝙡 𝙘𝙝𝙖𝙣𝙣𝙚𝙡𝙨. 𝙔𝙤𝙪𝙧 𝙨𝙪𝙥𝙥𝙤𝙧𝙩 𝙝𝙚𝙡𝙥𝙨 𝙪𝙨 𝙜𝙧𝙤𝙬 𝙩𝙝𝙧𝙤𝙪𝙜𝙝 𝙧𝙚𝙖𝙘𝙝𝙞𝙣𝙜 𝙛𝙪𝙧𝙩𝙝𝙚𝙧!

⦿ Website @ www.flowbase.co
⦿ Webflow @ www.webflow.com/flowbase
⦿ Twitter @ www.twitter.com/t_bekkers
⦿ Instagram @ www.instagram.com/flowbase.co

⁃⁃⁃⁃

✒️ Licence Notes:

⦿ Images available under CC0 (Unsplash, Pexels, Freepix or Similar)
⦿Typography available under SIL Open Font License 1.1 (Inter)
⦿ Iconography available under CC0 (UpLabs, Flaticon, Noun Project)

Testimonial Slider Section (CLONE)

Testimonial Slider (Custom Slider Arrows)

Hiii everyone , this is one of my favorite section transition , 
You can keep different colors for different sections easily , 

when u open the project , u will not see any think , make sure to create a temporary combo class ( like temp or tempo ) so that you ca set a background color for the section while designing and when done, you can just remove the temporary class , 

Clone it to make it yours...
Follow me for more amazing stuff....
thanks

Section Scroll background transition

Section scroll background transition

Cloneable 3d carousel slider with nested nine elements and a few lines lightweight JavaScript! enjoy your meal. all CSS 3d transforms and HTML hierarchy dev blocks are made with native Webflow, JavaScript is only for the incremental increase of the angle of rotation.

Couldn't be there without David DeSandro's Intro to CSS 3D transforms.

Tasty 3D Carousel

3d Carousel

A slider showing multiple slides
-
Sabanna method > https://forum.webflow.com/t/unique-slider-layout/24011
-
The project was made to help a forum question > https://forum.webflow.com/t/help-slider-issue/75867
-
Needs work for mobile breakpoints

Multiple Slides

NicelyDone UI Kit gives you a comprehensive collection of HTML, CSS, and JS components which are simple to use in Webflow, customizable and extendable. 

It provides a great structure for building websites quickly with a scalable and maintainable foundation. Get the same benefits as BEM, but without any hassle.

NicelyDone UI Kit treats words and classes as the exchangeable concepts. Classes use syntax from natural languages like noun/modifier relationships, word order, and plurality to link concepts intuitively. It comes equipped with an intuitive inheritance system and high level theming variables that let you have complete design freedom.   

Feel free to use it wherever/however you want, no credit needed.

Please give this project a like so others can see it!

UI Kit & Style Guide Template

NicelyDone — UI Kit & Style Guide Template (Copy + Paste)

Hey Webflow,

I quickly created this cloneable site to help answer a question on our forums:
https://forum.webflow.com/t/vertical-slider-with-pagination-on-the-right-side/45423

The solution allows users to click on the menu dots on the right hand side to access different sections throughout the site.

This solution was inspired by the following site: http://www.thepathfinders.world/

Hopefully this helps :blush:

Best regards,
Micah

Vertical Menu with Section Selection

Concept website for a wellness resort. Testing my webflow skills.
Features 5 static pages and 1 dynamic page.

Images are from Unsplash / Pexels.

Discover sliders websites built by the Webflow community

Discover sliders websites built by the Webflow community