Question

我在我为公司创建的网站上使用jCarousel。我使用的是jCarousel附带的默认javascript。

<ul id="mycarousel" class="jcarousel-list jcarousel-list-horizontal" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; left: 0px;width: 2084px;">

宽度是由jCarousel带来的javascript生成的，但我可以通过它来查找以确定更改值的位置。

任何帮助都会很棒。

以下是我正在处理的内容的链接：http://marcbrigham.com/lynxems/index.html

Answer 1

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  245px;
    height: 75px;
}

取自examples中使用的默认Tango皮肤。

您使用的是什么样的皮肤/主题/ CSS？ jCarousel需要更改width以启用幻灯片，但包装元素应该使用overflow: hidden;。

<强>更新

此CSS编辑使其看起来不错，但如果您需要它来覆盖#mainhome的整个宽度，则应考虑更改图像的大小。

.jcarousel-skin-tango .jcarousel-container-horizontal {
  width: 765px;
  padding: 20px 40px;
  height: 200px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
  width: 775px;
  height: 190px;
}

另一种选择可能是将margin: 0 40px;添加到.jcarousel-skin-tango .jcarousel-clip-horizontal。

Answer 2

您还可以创建CSS样式并向其添加!important，这将覆盖内联样式。例如：

#carousel {
    width: 1000px !important;
}

虽然这有效，但我发现如果容器太宽，你将能够滚动到其中的项目之外。我还在寻找解决方法。

还有一个新版本（0.3.0），但开发者网站上还没有任何真正好的例子。

Answer 3

只需在你的CSS中添加一个样式：

.jcarousel-list-horizontal {width: x}

的Al

jcarousel宽度问题

3 个答案: