iCarousel CSS & Opera

HTML & CSS
1

Has anybody had much experience with iCarousel image slider and Opera. The JavaScript is working fine and I think its a CSS issues which is only apparent in Opera browser. You have to set the content width wide enough to accommodate all your images if they were aligned next to each other in a long row. E.g. 10 images all 100px wide would need a container width in excess of 1000px to work properly. This is perfect until the required width approaches 13900px. The opera wont render the slider properly. It’s although it wont recognise a width of more than this. Every other browser works perfectly (event IE6!)

Is there some pixel width / height that opera wont recognise that I don’t know about?

2

Hi,

I believe operas limit is 32778px.

Do you have a link to the page in question?

Opera seems fine with this scroll in excess of 14,000px


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
.test {
    float:left;
    width:660px;
    height:300px;
    overflow:auto;
}
.scrollbox {
    width:16000px;
    height:220px;
    margin:0;
    padding:0;
    list-style:none;
}
.scrollbox li {
    float:left;
    width:200px;
    height:200px;
    margin:10px;
    background:red
}
</style>
</head>
<body>
<div class="test">
    <ul class="scrollbox">
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test</li>
        <li>test last</li>
    </ul>
</div>
</body>
</html>
3

This may well be my problem then. Here is a link to the test site.

http://www.xinhui.org/album-83-Commissioned+_+Product.html

Where this album works fine as it has less content. http://www.xinhui.org/album-88-Other+images.html

Maybe there is no fix for this. As to get this working the content width is well in excess of 100000px!

4

Hi,

Yes you have exceeded operas limit here:


<ul style=[B]"left: -32505px[/B];" id="carousel_content">

I don’t see a fix for this as that is the maximum Opera will work with.

Opera is also suffering from the vertical scrollbar bug which we reported in another thread. There is no fix for that either until they fix opera.

5

I thought as much but always worth a post. Thanks anyway.

I find opera very fustrating as its a standards complient browser, offers some great features and is quick I found. But there are quite a few sites it wont work with. It was back to firefox for me!