【问题标题】:carousal jquery is not working in firefox and operacarousel jquery 在 Firefox 和 Opera 中不起作用
【发布时间】:2025-12-03 23:55:01
【问题描述】:

我在我的页面 www.woody.my 的底部使用了水平轮播,使用 chrome explorer 可以正常使用轮播,而使用 firefox、opera、IE 时它是不可见的。

下面是它在 chrome 中的样子:

虽然这是它在 Firefox 中的外观:

【问题讨论】:

  • 你能显示你的代码吗?
  • 您可以使用inspect element (chrome) 还是使用Firebug (firefox) 查看它。这只是一个 CSS 问题。
  • 您能否提供指向您网站的链接?
  • 我的网站是 www.woody.my

标签: html css google-chrome firefox opera


【解决方案1】:

HTML 中的这个

<ul style="width: 1000px;">

CSS 行中的这个:526

.infiniteCarousel ul li {
    background: url("../images/footer_img_box.png") no-repeat scroll 0 0 transparent;
    display: block;
    float: left;
    height: 220px;
    padding: 10px;
    position: relative;
    width: 198px;
}
.infiniteCarousel .wrapper ul {
width: 900px;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
padding: 0;
top: 0;
}

虽然&lt;li&gt; 的位置是绝对的,但它们会堆叠在一起。需要将位置更改为相对位置,并且主容器的尺寸非常大,为 9999px,将其更改为视口,当元素彼此浮动时您可以看到它们

同时删除.infiniteCarousel .wrapper ul类上的位置

【讨论】:

  • 你也可以把ul的宽度改成100%
  • 谢谢你,Mehrdad,你的回答很有帮助
【解决方案2】:

试试这个

.infiniteCarousel ul li {
    background: url("../images/footer_img_box.png") no-repeat scroll 0 0 transparent;
    display: block;
    float: left;
    height: 220px;
    padding: 10px;
    position: absolute;
    width: 198px;
}

ps 我也在马来西亚 :)

【讨论】:

  • 谢谢Mr.Mehrdad,但轮播在firefox中显示不正确,而在chrome中没有出现。