Advanced Carousel Pro Demos

Take your WordPress carousels to the next level with Advanced Carousel Pro Demos, designed to seamlessly integrate with Gutenberg. These demos showcase powerful enhancements using SwiperJS, bringing smooth animations, interactive navigation, and fully customizable behaviors to your WordPress site.

  • Carousel with Blend Mode Hover and Zoom Background

    This full-width carousel features a custom hover effect powered by mix-blend-mode, creating a striking visual interaction between the mouse pointer and the carousel elements. When hovering, a zoom effect is applied to the background image, adding a sense of depth and immersion. The carousel also supports smooth horizontal scrolling with the mouse or trackpad, offering a fluid browsing experience across all devices. The combination of blend modes, background transformations, and native scroll makes this component highly engaging and visually dynamic.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • Synchronized Card Slider with Dual Swipers

    This carousel setup features the elegant cards effect from SwiperJS, delivering a tactile, swipeable card interface with natural movement and depth. What makes it truly unique is the synchronization of two separate Swipers—one for visual content and another for textual or interactive information. Using controller.control, both sliders move in harmony: when you interact with one, the other follows seamlessly.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • SwiperJS – Immersive Netflix-Style Carousel

    This is a full-width Netflix-style carousel, designed to deliver a dynamic and immersive browsing experience. Each element features an advanced hover effect that reveals additional information and applies a custom zoom effect, varying based on the element’s position within the carousel. To achieve seamless interactions, the design incorporates dedicated empty space above and below the carousel, ensuring that elements can expand beyond their original boundaries without overflow restrictions. This technique enhances the depth and interactivity of the layout. The entire effect has been meticulously crafted using custom JavaScript and CSS, allowing for precise control over animations, transitions, and layering.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • Showcase Carousel

    This carousel is designed to display one element at a time, offering a refined and structured layout for optimal content focus. It features a custom internal layout, ensuring flexibility in presenting various types of content. The pagination and progress bar are positioned in the bottom right corner, providing a clean and intuitive navigation experience. This effect has been achieved through custom CSS, allowing precise control over the carousel’s structure and animations.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • Showcase Carousel

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • SwiperJS – Slider with Tabbed Navigation

    This SwiperJS-powered slider features an advanced tabbed navigation system instead of traditional dots. Each tab displays a title corresponding to the related slide, allowing users to switch between sections effortlessly. The tabbed navigation has been implemented using a lightweight custom JavaScript function, which can be easily integrated within the plugin. This ensures a seamless and dynamic interaction while maintaining full flexibility for customization.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.

  • SwiperJS – Slider with Animated SVG Navigation

    This SwiperJS-powered slider features a custom navigation system enhanced with an animated SVG icon. The SVG animation is seamlessly integrated using a combination of CSS and JavaScript, ensuring smooth and dynamic visual effects when users interact with the navigation buttons.

    Unlock Full Access to Copy This Pattern 🚀

    You need an active license to copy this pattern.