Swiper API: Navigation

Navigation Parameters

ParameterTypeDefaultDescription
navigationobject Object with navigation parameters. For example:var mySwiper = new Swiper('.swiper-container', { navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, }); 
{
nextElstring / HTMLElementnullString with CSS selector or HTML element of the element that will work like “next” button after click on it
prevElstring / HTMLElementnullString with CSS selector or HTML element of the element that will work like “prev” button after click on it
hideOnClickbooleanfalseToggle navigation buttons visibility after click on Slider’s container
disabledClassstring‘swiper-button-disabled’CSS class name added to navigation button when it becomes disabled
hiddenClassstring‘swiper-button-hidden’CSS class name added to navigation button when it becomes hidden
}

Navigation Methods & Properties

Properties
mySwiper.navigation.nextElHTMLElement of “next” navigation button
mySwiper.navigation.prevElHTMLElement of “previous” navigation button
Methods
mySwiper.navigation.update();Update navigation buttons state (enabled/disabled)

Leave a Comment

Your email address will not be published.