StreamGallery-docs - Bricksfusion

Stream Gallery creates a stunning, seamless scrolling gallery on your page, perfect for showcasing images in a dynamic, eye-catching way. This gallery is highly customizable, allowing you to set speeds, overlay colors, and other features to match your site's style.

Preview

Open preview

Quick Setup

data-background-carousel

Required

Activates the Stream Gallery effect on the specified container.

data-carousel-top-images

Required

Provides a list of image URLs to display in the top lane. Type: JSON array (e.g., ["image1.jpg", "image2.jpg"]).

data-carousel-bottom-image

Required

Provides a list of image URLs to display in the bottom lane. Type: JSON array (e.g., ["image1.jpg", "image2.jpg"]).

Advanced configuration

data-carousel-speed

Optional

Controls the animation speed of the gallery scroll.

Default: 30

data-carousel-overlay-color

Optional

Sets the overlay color over the carousel images.

Default: rgba(0, 0, 0, 0.5).

data-carousel-overlay-opacity

Optional

Adjusts the opacity of the overlay.

Default: 0.5

data-carousel-image-gap

Optional

Defines the spacing between images in the carousel.

Default: 20

data-carousel-track-height

Optional

Sets the height of each image track (lane) in the gallery.

Default: 180

data-carousel-mobile-track-height

Optional

Defines the track height on mobile for better responsiveness.

Default: 180

data-carousel-image-width-ratio

Optional

Adjusts the aspect ratio of the images in the carousel.

Default: 1.5

Tips

Responsive: The gallery adapts to mobile devices automatically, with customizable track heights for a consistent experience across all screen sizes.

Visual Configurator

Documentation

GETTING STARTED

MENU ANIMATIONS

CORE BACKGROUND

SHOWCASE

VISUAL EFFECTS

ANIMATED TEXT

INTERACTION

INSTANT MOTION

SURECART

BUTTONS

TRANSITION PAGES

Stream Gallery

Preview

Quick Setup

Advanced configuration

Tips

We're here to help

Contact Support