CODEWITHSUNDEEP
htmlcssgoogle-chromefirefoxopera
Dan
Dan

Reputation: 353

carousal jquery is not working in firefox and opera

am using horizontal carousal at the bottom of my page www.woody.my, the carousal works fine using chrome explorer while its invisible using firefox, opera, IE.

Below is the image how it looks in chrome :

enter image description here

while this how it looks in firefox : enter image description here

Upvotes: 0

Views: 85

Answers (2)

meewog
meewog

Reputation: 1740

This in the HTML

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

And this one in the CSS line: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;
}

Whilst the position of the <li> are absolute, they get stacked on top of each other. Needed to change the position to relative, also the main container had an extremely large size of 9999px, change that to the view port to when the elements are floated left of each other you can see them

Also remove the position on .infiniteCarousel .wrapper ul class

Upvotes: 1

meewog
meewog

Reputation: 1740

try this

.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 I'm in Malaysia too :)

Upvotes: 0

Related Questions