Sticky Full Page Effect Slider Using Tailwind UI
Sticky full-page effect slider created using Tailwind CSS for seamless and engaging content navigation.
other
Loading component...
24 lines
<!-- Slide 1 -->
<div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-blue-500">
<h1 class="text-white text-4xl font-bold">Slide 1 (scroll down)</h1>
</div>
<!-- Slide 2 -->
<div class="sticky top-0 flex-col h-screen flex items-center justify-center bg-green-500">
<h1 class="text-white text-4xl font-bold">Slide 2 (scroll down)</h1>
</div>
<!-- Slide 3 -->
<div class="sticky top-0 flex-col h-screen flex items-center justify-center bg-red-500">
<h1 class="text-white text-4xl font-bold">Slide 3 (scroll down)</h1>
</div>
<!-- Slide 4 -->
<div class="sticky top-0 flex-col h-screen flex items-center justify-center bg-yellow-500">
<h1 class="text-white text-4xl font-bold">Slide 4 (scroll down)</h1>
</div>
<!-- Slide 5 -->
<div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-indigo-500">
<h1 class="text-white text-4xl font-bold">Slide 5</h1>
</div>