1

我正在使用 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%。由于某种原因,这不起作用。

我想问题是我如何拥有 100% 的宽度,<li>以便它可以扩展到屏幕末尾。

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

更新

如果我在任何类上设置宽度:105%,那么它会给出全宽。但是,一旦我进入更大的屏幕,它就会再次出现问题......请帮助

4

4 回答 4

1

我不确定它是否会起作用,但请尝试

.body {
    width: 100%;
}

在你的 CSS

于 2010-07-07T02:04:45.380 回答
1

我最终使用了另一个插件

于 2010-07-17T18:56:30.317 回答
0

实际上我必须添加 li 和 ul 100% with and no paddin no margin ...

于 2010-07-07T20:16:30.363 回答
0
$('.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();
于 2015-12-07T07:01:12.333 回答