DxCarousel.SlideShowEnabled Property

Specifies whether the slide show functionality is enabled.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(false)]
[Parameter]
public bool SlideShowEnabled { get; set; }

Property Value

Type	Default	Description
Boolean	false	true to enable the slide show; otherwise, false.

Remarks

Set the SlideShowEnabled property to true to enable the slide show functionality in a <DxCarousel> component. To adjust the time interval between slide changes, use the SlideShowDelay property.

You can also use the following properties to specify whether users can stop or pause the slide show:

StopSlideShowOnPaging

Specifies whether to stop the slide show on paging.

PauseSlideShowOnHover

Specifies whether to pause the slide show on hover.

Example

The following code snippet changes Carousel slides automatically every 3 seconds (3,000 milliseconds):

<DxCarousel Width="500px"
            Height="300px"
            Data="@GetCarouselData()"
            LoopNavigationEnabled="true"
            ImageSizeMode="CarouselImageSizeMode.FillAndCrop"
            SlideShowEnabled="true"
            SlideShowDelay="3000">
</DxCarousel>

@code {
    List<CarouselData> GetCarouselData() {
        List<CarouselData> result = new List<CarouselData>();
        result.Add(new CarouselData("../images/image1.jpg", "Image 1"));
        result.Add(new CarouselData("../images/image2.jpg", "Image 2"));
        result.Add(new CarouselData("../images/image3.jpg", "Image 3"));
        result.Add(new CarouselData("../images/image4.jpg", "Image 4"));

        return result;
    }

    public class CarouselData {
        public string Src { get; set; }
        public string Alt { get; set; }

        public CarouselData(string src, string alt) {
            Src = src;
            Alt = alt;
        }
    }
}