Bx slider in SuiteCommerce Advanced

In SuiteCommerce Advanced website, sliders are implemented by using jQuery bx slider.

Configuration Options: BxSlider provides a wide range of options to customize the slider’s behavior. For example:

  • mode: Defines the transition type (horizontal, vertical, or fade).
  • auto: Enables automatic sliding.
  • pause: Sets the duration between slides.
  • controls: Adds navigation controls like next/previous buttons.
  • pager: Displays pagination dots.

Responsive Design: BxSlider supports responsive layouts by adjusting the number of visible slides based on the screen size. You can use options like minSlides, maxSlides, and slideWidth to control the slider’s appearance.

Advanced Features: It also supports features like infinite looping, custom animations, and callbacks for events like slide transitions.

An example for bx slider properties initialization is given below.

const bxSliderValues = {

                        mode: ‘vertical’,

                        slideMargin: 10,

                        minSlides: 3,

                        maxSlides: 10,

                        moveSlides: 1,

                        slideWidth: 200,

                        pager: false,

                        controls: false,

                        infiniteLoop: false

 };

Leave a comment

Your email address will not be published. Required fields are marked *