To make that clear: first and .last are the indexes of the first and last visible items. The exampel shows 3 items at a time, so this is the correct behaviour.

Or did i misunderstood something?

Jan

Oh right; I hadn't realised that about .first and .last. In that case, they are correct.

I thought it might be related to the main issue which is the ul sizing problem, which is why I included it.

It's really hard to say why the width is calculated at 40px without actually having some code to inspect. Maybe you can extract the relevant parts and show me some code that i can see what styles are applied etc.

I just tried out the carousel HTML in a dummy page and it worked fine. I guess it must be something about my application that's causing the problem, perhaps the fact that the list items are added to the list dynamically? Mind you, I get the same results when using jCarousel.add().

What's the behaviour of jCarousel when the containing HTML is hidden and then displayed? I have the jCarousel initialisation statement after the section display statement.

I just did a spot of debugging of the jCarousel plug-in with Firebug, and the problem appears to be rooted in the fact that the list items' offsetWidth properties are being reported as 0. Why this might be, I don't know; I've even tried specifying dimensions for the list items in a style attribute on the <li>s themselves with no luck.

Thats weird. I'm going to investigate that further the next days and will reply here. Maybe i will implement an option to set a explicit width/height if it could not be detected from the element itself. Something like:

$('#carousel').jcarousel({itemDimension: 75});

Jan

Sounds good, thanks for the follow-up!

I've implemented a item fallback dimension in a branch. Can you please use http://github.com/jsor/jcarousel/blob/3f8e2e81554c544aed901ffed98ba93e15dc6998/lib/jquery.jcarousel.js and check if it works with the itemFallbackDimension option.

Use it like:
$('#carousel').jcarousel({itemFallbackDimension: 75});

Jan

Thanks so much for this! It looks to be working ok - I'm still seeing a couple of issues, but they might be related to the CSS. I'll investigate further and post back.

Ok, i'm closing this issue. The new feature is now merged to the 0.2 branch and will be included in the next release.

Please use the file from this branch (http://github.com/jsor/jcarousel/blob/0.2/lib/jquery.jcarousel.js) because there was a bug in the file i linked in my post above which is fixed now.

Wow very nice. This was driving me crazy. Will test now. Thanks

I've not checked what you have inside your carousel items but if they are images that you are calculating the width/height of on load then you may be running into a separate issue that some are having with opera/safari/chrome

I've came across that bug when using Refinery CMS which use jCarousel for the admin menu, here's what I've found:

In my case, the I'm getting strange readings from the offsetWidth property:

• adding the offsetWidth of each menu items gives 581px
• the width set by jCarousel is 591px
• the minimum width for the bug to disappear is 594px

Also the bug only show up when the page is zoomed.

I am having same issue. My code works fine on localhost but when I uploaded it on server, width of ul is being calculated. I dont have fixed width li so cant try this solution.

I think it´s not the problem of the jcarousel plugin.

The browsers put the images after the first load in cache and if you trying to get the width right after reload a page from the cached image, its 0.

So the plugin can´t geht the right width to calculate the wrapper div width.