jquery - jcarousellite を使用した幅 100% の水平スライド

Question

jcarousellite コントロールを使用して、次のボタンと前のボタンを介して画像にカルーセル効果を提供しています。

<button class="prev"><<</button>
<button class="next">>></button>

<div class="anyClass" style="background-color:Red;" >

    <ul style="width:100%">
        <li style="width:100%" ><div style="background-color:Green; width:100%; text-align:center; margin:0 auto;" ><img src="Untitled-1.jpg" /></div></li>
        <li style="width:100%"><div style="background-color:yellow; width:100%; text-align:center; margin:0 auto;" ><img src="Untitled-2.jpg" /></div></li>
        <li style="width:100%"><div style="background-color:Green; width:100%; text-align:center; margin:0 auto;" ><img src="Untitled-1.jpg" /></div></li>
        <li style="width:100%"><div style="background-color:yellow; width:100%; text-align:center; margin:0 auto;" ><img src="Untitled-2.jpg" /></div></li>            
    </ul>
</div>

ブラウザの幅まで広げてほしい。幅 : 100%。これは何らかの理由で機能しません。

<li>問題は、画面の最後まで拡大できるように、幅を 100% にする方法だと思います。

=========================

アップデート

width:105% をanyclassに設定すると、全幅になります。ただし、画面を大きくすると、再び問題が発生します...助けてください

Answer 1

別のプラグインを使用することになった

Answer 2

うまくいくかわかりませんが、試してみてください

.body {
    width: 100%;
}

あなたのCSSで

Answer 3

実際には、li と ul を 100% で、パディンなしでマージンなしで追加する必要がありました...それでうまくいきました

Answer 4

$('.jcarousel')
    .on('jcarousel:create jcarousel:reload', function() {
        var element = $(this),
            width = element.innerWidth();

        if (width > 900) {
            width = width / 1;
        } else if (width > 600) {
            width = width / 1;
        }

        element.jcarousel('items').css('width', width + 'px');
    })
        $('.jcarousel').jcarousel();