jcarousel宽度问题

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生成的，但我可以使用cypher来确定在何处更改该值。

任何帮助都是最好的。

这是我正在做的工作的链接：http://marcbrigham.com/lynxems/index.html

Answer 1

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

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

你使用的是什么皮肤/主题/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;
}

另一种选择是在.jcarousel-skin-tango .jcarousel-clip-horizontal中添加margin: 0 40px;。

Answer 2

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

#carousel {
    width: 1000px !important;
}

虽然这是可行的，但我发现如果容器太宽，您将能够滚动超出其中的项目。我仍在寻找解决此问题的方法。

还有一个新版本(0.3.0)，但在开发者网站上还没有真正好的例子。

Answer 3

只需给你的css添加一个样式：

.jcarousel-list-horizontal {width: x}

阿尔