javascript - carousellite - 指定按设备宽度可见的幻灯片

Question

恐怕我不太擅长 javascript，非常感谢指导。

使用 jcarouselite，这段代码位于正文的顶部：

<script type="text/javascript">
$(function() {
$(".carousellite").jCarouselLite({
    btnNext: ".next",
    btnPrev: ".prev",
    auto: 1200,
    speed: 3000,
    easing: "easeInOutExpo",
    visible: 5,
    pauseOnMouseOver: true, // This is the configuration parameter
    circular: true
});    
});
</script>

如果设备宽度<=480px，我希望可见数字的值为1，如果更多，则为5。

我尝试在上面的表达式中使用这样的代码，但没有成功：

if ($(window).width() < 480) {
   $(".carousellite").jCarouselLite({visible: 1});
}
else {
   $(".carousellite").jCarouselLite({visible: 5});
}

我会很感激一些帮助。

谢谢！

乔纳森

Answer 1

I have found my own solution

    <script>
    setTimeout(function(){
        if (screen.width < 480 ){
            //scripts for smaller screens
            $(".carousellite").jCarouselLite({
    visible: 1
    });
        }
    },300)
</script>

Thanks to: http://scriptcult.com/subcategory_1/article_856-get-device-width-screen-width-on-mobile-devices.html