What needs to be added in the script so that its parameters change depending on the screen size?

Question

JavaScript

Faced the following problem using the bxSlider plugin. It is necessary to add a condition in the plugin call code that changes the number of slides in the carousel to 1 for mobile devices.

Right now I have the following plugin setup

$(document).ready(function(){
  $('.slider').bxSlider({
    slideWidth: 400,
    minSlides: 2 
  });
});

The bottom line is that with such a plugin call, I have a 2-slide carousel, which needs to be fixed for mobile devices.

Answer 1

Does it fit?

$(document).ready(function(){
  $('.slider').bxSlider({
      slideWidth: 400,
      maxSlides: 2,
      minSlides: 1
    });
});

Answer 2

Media queries can be applied directly in js

var mobile = window.matchMedia( "(max-width: 768px)" );
if (mobile.matches) {
 // если маленький экран
 $('.slider').bxSlider({
      ...
  });
} else {
 // иначе
 $('.slider').bxSlider({
    ...
  });
}