Skip to content

Slider (Nestable) Schema

PropertyValue
nameslider-nested
categorymedia
tagdiv
nestabletrue
KeyTypeLabelCSS
optionsTypeselectOptions type
optionscodeCustom options
typeselectType
directionselectDirection
keyboardselectKeyboard
autoHeightcheckboxAuto height
heightnumberHeight
gapnumberSpacing
startnumberStart index
perPagenumberItems to show
perMovenumberItems to scroll
speednumberSpeed in ms
focusnumberFocus
autoplaycheckboxAutoplay
pauseOnHovercheckboxPause on hover
pauseOnFocuscheckboxPause on focus
intervalnumberInterval in ms
rewindcheckboxRewind
rewindByDragcheckboxRewind by drag
rewindSpeednumberSpeed in ms
slidePaddingspacingPaddingpadding on .splide__slide
slideAlignHorizontalalign-itemsAlign horizontalalign-items on .splide__slide
slideAlignVerticaljustify-contentAlign verticaljustify-content on .splide__slide
slideBackgroundbackgroundBackgroundbackground on .splide__slide
slideBorderborderBorderborder on .splide__slide
arrowscheckboxShow
arrowHeightnumberHeightheight on .splide__arrow
arrowWidthnumberWidthwidth on .splide__arrow
arrowBackgroundcolorBackgroundbackground-color on .splide__arrow
arrowBorderborderBorderborder on .splide__arrow
arrowColorcolorColorcolor on .splide__arrow, fill on .splide__arrow svg
arrowSizenumberSizefont-size on .splide__arrow, height on .splide__arrow svg, width on .splide__arrow svg, min-height on .splide__arrow, min-width on .splide__arrow
arrowTextShadowtext-shadowText shadowtext-shadow on .splide__arrow
arrowDisabledBackgroundcolorBackgroundbackground-color on .splide__arrow:disabled
arrowDisabledBorderborderBorderborder on .splide__arrow:disabled
arrowDisabledColorcolorColorcolor on .splide__arrow:disabled, fill on .splide__arrow:disabled svg
arrowDisabledOpacitynumberOpacityopacity on .splide__arrow:disabled
prevArrowiconPrev arrow on .splide__arrow--prev > *
prevArrowTopnumberToptop on .splide__arrow--prev
prevArrowRightnumberRightright on .splide__arrow--prev
prevArrowBottomnumberBottombottom on .splide__arrow--prev
prevArrowLeftnumberLeftleft on .splide__arrow--prev
prevArrowTransformtransformTransformtransform on .splide__arrow--prev
nextArrowiconNext arrow on .splide__arrow--next > *
nextArrowTopnumberToptop on .splide__arrow--next
nextArrowRightnumberRightright on .splide__arrow--next
nextArrowBottomnumberBottombottom on .splide__arrow--next
nextArrowLeftnumberLeftleft on .splide__arrow--next
nextArrowTransformtransformTransformtransform on .splide__arrow--next
paginationcheckboxShow
paginationSpacingspacingMarginmargin on .splide__pagination .splide__pagination__page
paginationHeightnumberHeightheight on .splide__pagination .splide__pagination__page
paginationWidthnumberWidthwidth on .splide__pagination .splide__pagination__page
paginationColorcolorColorcolor on .splide__pagination .splide__pagination__page, background-color on .splide__pagination .splide__pagination__page
paginationBorderborderBorderborder on .splide__pagination .splide__pagination__page
paginationHeightActivenumberHeightheight on .splide__pagination .splide__pagination__page.is-active
paginationWidthActivenumberWidthwidth on .splide__pagination .splide__pagination__page.is-active
paginationColorActivecolorColorcolor on .splide__pagination .splide__pagination__page.is-active, background-color on .splide__pagination .splide__pagination__page.is-active
paginationBorderActiveborderBorderborder on .splide__pagination .splide__pagination__page.is-active
paginationTopnumberToptop on .splide__pagination, bottom on .splide__pagination
paginationRightnumberRightright on .splide__pagination, left on .splide__pagination, transform on .splide__pagination
paginationBottomnumberBottombottom on .splide__pagination
paginationLeftnumberLeftleft on .splide__pagination, right on .splide__pagination, transform on .splide__pagination

Shared CSS controls available on all elements. Keys are prefixed with _ and support responsive/pseudo-class variants via colon syntax (e.g. _typography:tablet_portrait:hover).

KeyTypeLabelCSS
_contenttextContentcontent
_marginspacingMarginmargin
_paddingspacingPaddingpadding
_widthnumberWidthwidth
_widthMinnumberMin. widthmin-width
_widthMaxnumberMax. widthmax-width
_heightnumberHeightheight
_heightMinnumberMin. heightmin-height
_heightMaxnumberMax. heightmax-height
_aspectRatiotextAspect ratioaspect-ratio
_positionselectPositionposition
_topnumberToptop
_rightnumberRightright
_bottomnumberBottombottom
_leftnumberLeftleft
_zIndexnumberZ-indexz-index
_ordernumberOrderorder
_displayselectDisplaydisplay, align-items
_visibilityselectVisibilityvisibility
_overflowtextOverflowoverflow
_opacitynumberOpacityopacity
_cursorselectCursorcursor
_isolationselectIsolationisolation
_mixBlendModeselectMix blend modemix-blend-mode
_pointerEventstextPointer eventspointer-events
_perspectivenumberPerspectiveperspective
_perspectiveOrigintextPerspective originperspective-origin
_gridItemJustifySelfalign-itemsJustify selfjustify-self
_flexDirectiondirectionDirectionflex-direction
_alignSelfalign-itemsAlign selfalign-self
_justifyContentjustify-contentAlign main axisjustify-content
_alignItemsalign-itemsAlign cross axisalign-items
_gapnumberGapgap
_flexGrownumberFlex growflex-grow
_flexShrinknumberFlex shrinkflex-shrink
_flexBasistextFlex basisflex-basis
_useMasonrycheckbox%s layout
_masonryColumnnumberColumns--columns
_masonryGutternumberSpacing--gutter
_masonryHorizontalOrdercheckboxHorizontal order
_masonryTransitionDurationnumberTransition
_masonryTransitionModeselectReveal animation
_typographytypography_typographyfont
_backgroundbackground_backgroundbackground
_shapeDividersrepeaterCustom shape
_gradientgradient_gradientbackground-image
_borderborderBorderborder
_boxShadowbox-shadowBox shadowbox-shadow
_transformtransformTransformtransform
_transformOrigintextTransform origintransform-origin
_motionElementParallaxcheckboxElement parallax
_motionElementParallaxSpeedXnumberHorizontal speed--brx-motion-parallax-speed-x
_motionElementParallaxSpeedYnumberVertical speed--brx-motion-parallax-speed-y
_motionBackgroundParallaxcheckboxBackground parallax
_motionBackgroundParallaxSpeednumberBackground speed--brx-motion-background-speed
_motionStartVisiblePercentnumberParallax start point
_cssCustomcodeCustom CSS
_cssClassestextCSS classes
_cssIdtextCSS ID
_cssFiltersfiltersCSS Filtersfilter
_cssTransitiontextTransitiontransition
_attributesrepeaterName
_scrollSnapTypeselectTypescroll-snap-type on html, scroll-snap-align on .brxe-section
_scrollSnapAlignselectAlignscroll-snap-align on .brxe-section
_scrollSnapStopselectStopscroll-snap-stop on .brxe-section