Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как выполнить код при изменении размера окна браузера ? (https://javascript.ru/forum/misc/76472-kak-vypolnit-kod-pri-izmenenii-razmera-okna-brauzera.html)

daimon0482 14.01.2019 22:35

Как выполнить код при изменении размера окна браузера ?
 
есть такой код где при изменении размера окна браузера, в карусель должно убавится или добавится количество слайдов, но он работает только после обновления, а как сделать чтобы он сработал без обновления страницы:
$(document).ready(function(){
      if ($(window).width() > 800) {
  $('.bxslider').bxSlider({
    slideWidth: 900,
    minSlides: 4,
    maxSlides: 3,
    moveSlides: 1,
    pager: false,
    auto: true
  });
}else{ 
   $('.bxslider').bxSlider({
    slideWidth: 900,
    minSlides: 2,
    maxSlides: 3,
    moveSlides: 1,
    pager: false,
    auto: true
  });
}
});

j0hnik 14.01.2019 22:42

$(document).ready(slider);
$(window).resize(slider);

function slider() {

if ($(window).width() > 800) {
  $('.bxslider').bxSlider({
    slideWidth: 900,
    minSlides: 4,
    maxSlides: 3,
    moveSlides: 1,
    pager: false,
    auto: true
  });
}else{ 
   $('.bxslider').bxSlider({
    slideWidth: 900,
    minSlides: 2,
    maxSlides: 3,
    moveSlides: 1,
    pager: false,
    auto: true
  });
}
}


не факт что сработает

daimon0482 14.01.2019 23:29

нет к сожалению не работает.

laimas 14.01.2019 23:58

$(document).ready(function(){
    
    var slider = $('.bxslider').bxSlider({
        slideWidth: 900,
        minSlides: $(window).width() > 800 ? 4 : 2,
        maxSlides: 3,
        moveSlides: 1,
        pager: false,
        auto: true
    });
    
    $(window).resize(function() {
        slider.reloadSlider({minSlides: $(window).width() > 800 ? 4 : 2})
    });
    
}});

daimon0482 15.01.2019 00:40

и так тоже не работает.

laimas 15.01.2019 01:06

Цитата:

Сообщение от daimon0482
и так тоже не работает

А другого способа и нет, кроме как не убить слайдер, а затем пять заново создать с инициализацией. А это накладно, поэтому в нем есть метод обновления reloadSlider(), в который можно передавать объект опций. Почитайте API.

daimon0482 15.01.2019 18:34

да я понимаю но не работает, он меняется но не корректно вместо трех слайдов переходит на один большой и один маленький только после обновления переходит в норму .

laimas 15.01.2019 19:29

Цитата:

Сообщение от daimon0482
он меняется но не корректно

Может надо передать и другие опции, а не только количество слайдов.


Часовой пояс GMT +3, время: 03:24.