v2.5.2
Giriş yap

Jquery Nesneler

onlywhatchess
438 defa görüntülendi

Selamlar,
GitHub Light Slider kullanıyım dedim gayet güzel çalışıyor ama responsive ile ilgili sorunum var aşağıdaki gibi çağrıyorum


$("#content_slider").lightSlider({
    loop: true,
    pager: false,
    item: 6
});

item özelliği kaç tane slide gösteriliceğini belirliyor,
ben bilgisayarda 6 tablette 3 telefonda 2 tane göstermek istiyorum.
Şöle bir şey denedim çalışsada mantıklı gelmiyor, ki zaten ben tarayıcıyı küçültürsem sayfayı yenilemeden etki etmiyor.

 
var x = {
    loop: true,
    pager: false
}
var wn = $(window).innerWidth();
if (wn >= 991.98) {
    x.auto = true;
    x.item = 5;
} else if (wn >= 767.98) {
    x.auto = true;
    x.item = 3;
} else {
    x.item = 1;
}
$("#content_slider").lightSlider(x);
 
selim
1380 gün önce

Siteye girdim ve yukarda examples kısmındaki ilk örnek sizin istediğiniz responsive özelliğini sağlıyor.

  $(document).ready(function() {
    $('#responsive').lightSlider({
        item:4,
        loop:false,
        slideMove:2,
        easing: 'cubic-bezier(0.25, 0, 0.25, 1)',
        speed:600,
        responsive : [
            {
                breakpoint:800,
                settings: {
                    item:3,
                    slideMove:1,
                    slideMargin:6,
                  }
            },
            {
                breakpoint:480,
                settings: {
                    item:2,
                    slideMove:1
                  }
            }
        ]
    });  
  });

responsive altındaki breakpoint kısımları sayfanın genişlik değeri.