Jquery 具有100%li项目宽度的jcarousel?

Jquery 具有100%li项目宽度的jcarousel?,jquery,width,html-lists,jcarousel,Jquery,Width,Html Lists,Jcarousel,我试图让jcarousel在li宽度为100%的情况下工作。i、 e.无论浏览器窗口有多宽,这都是li项的宽度,如果窗口缩小,文本将相应地流动,并且仍然起到滑块的作用 这是我的小提琴 我发现我必须使用取自以下示例的jQuery: 将ul的宽度设置为100%齿,使滑块停止工作。控件可以工作,但幻灯片不会改变。i、 e.在第一张幻灯片上没有“上一张”控件,当我到达列表末尾时,“下一张”控件将按其应有的方式消失。所以这是一种工作,但幻灯片没有改变。你能提供一个重现问题的方法吗?给你:我有同样的问题-

我试图让jcarousel在
li
宽度为100%的情况下工作。i、 e.无论浏览器窗口有多宽,这都是
li
项的宽度,如果窗口缩小,文本将相应地流动,并且仍然起到滑块的作用

这是我的小提琴


我发现我必须使用取自以下示例的jQuery:


ul
的宽度设置为100%齿,使滑块停止工作。控件可以工作,但幻灯片不会改变。i、 e.在第一张幻灯片上没有“上一张”控件,当我到达列表末尾时,“下一张”控件将按其应有的方式消失。所以这是一种工作,但幻灯片没有改变。你能提供一个重现问题的方法吗?给你:我有同样的问题-你找到解决这个问题的方法了吗?
$(document).ready(function() {
    var jcarousel = $('.carousel-stage');

    jcarousel
        .on('jcarousel:reload jcarousel:create', function () {
            var width = jcarousel.innerWidth();
            var height = jcarousel.innerHeight();

            if (width < 560) {
                jcarousel.jcarousel('items').css('width', width + 'px');
                jcarousel.jcarousel('items').css('height', (width*0.666) + 'px');
            } else {
                jcarousel.jcarousel('items').css('width', '600px');
                jcarousel.jcarousel('items').css('height', '400px');
            }

        })
});        
@media screen and (max-width: 660px) {
    .connected-carousels,
    .connected-carousels .stage,
    .connected-carousels .navigation,
    .connected-carousels .carousel-stage,
    .connected-carousels .carousel-navigation,
    .carousel-stage li img {
        width: 100%;
        height:auto;
    }
    .carousel-stage li img {
        padding: 0;
        margin: 0;
        vertical-align: top;
    }
    .connected-carousels .prev-stage, .connected-carousels .next-stage {
        width: 50%;
        height: 100%;
    }
    .jcarousel-clip-horizontal 
    {
        width: 100%;    
        overflow: hidden;
    }
}