Most landing pages scroll the same way: down a long column of stacked sections. The Vertical Fullscreen Hero Slider widget reimagines that journey, turning the top of your page into a series of full-height panels that snap into place one after another as the visitor scrolls. Each panel gets the whole screen, the backgrounds shift smoothly between them, and a side navigation tracks where you are, so a single hero can carry an entire story. It is built natively for Elementor, so all of that motion comes from the widget settings with no custom code at all.
What Is the Vertical Fullscreen Hero Slider Widget?
The Vertical Fullscreen Hero Slider widget is a scroll-snapping hero made of full-screen panels. Each slide carries a title, subtitle, description, button, image or background colour, and a short navigation label. You pick how each panel is laid out, how the content animates in, and how visitors move between panels. Because the whole experience runs in the browser, this Elementor hero feels like a bespoke one-page site while staying fast, responsive, and easy to edit.
Key Features of the Vertical Fullscreen Hero Slider
This Elementor hero ships with the controls a real launch page actually needs:
- Three layout modes per slider: full image background, split counter-scroll, and content-left, each with adjustable column or split ratios.
- Per-slide light or dark colour schemes, so text stays readable over any image or panel colour.
- Side navigation with optional labels, a scroll progress bar, smooth background colour transitions, and optional auto-scroll.
- Fade-up, slide-left, or scale content animations, full typography control, and floating decorative elements.
Why Use the Vertical Fullscreen Hero Slider on Your Site?
A hero that fills the screen and changes as you scroll holds attention far longer than a static banner, and it lets one page do the work of several. A wellness retreat can run full-image panels that move from mountain to lake with a calm fade-up, a contemporary art museum can split the screen so the artwork scrolls one way while the copy counter-scrolls the other, and a wealth advisory firm can keep the content on the left in a clean, light scheme with the imagery beside it. Per-slide schemes keep every panel legible, the side navigation gives visitors a sense of place, and the optional progress bar shows how far the story goes. It is responsive and touch friendly out of the box, so the slider reads just as well under a thumb as it does on a wide desktop screen.
Getting Started With the Vertical Hero in Minutes
Drop the widget into any Elementor section and add a panel for each part of your story in the repeater. Give every slide a title, subtitle, description, button, label, and an image or background colour, then set it to a light or dark scheme. Choose a layout mode and ratio, pick the content animation, and switch the side navigation, labels, progress bar, and auto-scroll on or off. Style the typography, buttons, dots, and progress bar to match your brand, and preview it live in the editor without writing any code by hand.
See the Vertical Fullscreen Hero Slider in Action
The demo page below shows three live builds across very different brands, each using a different layout mode, animation, and navigation style. Watch how full-image, split counter-scroll, and content-left change the whole feel of one component, then picture your own sections snapping into place. It is the fastest way to judge what this Elementor hero can do for your next campaign before you commit to a design.
The Vertical Fullscreen Hero Slider widget is part of the Sentio Addons for Elementor collection, alongside dozens of other performance-first tools. Add it to your toolkit, pair it with your strongest imagery, and give your next launch a homepage worth scrolling.