Klaus Hartl schrieb:
Jan Sorgalla schrieb:
Hi Klaus,
Hi jQuerians!
I was wondering if there is a mod for jCarousel out there, that allows
it to be flexible? I need the width of the list and its items to be
flexible (depending on the browser width).
I tried only a bit yet and tinkered with the windows resize event, to
adjust the width of .jcarousel-clip and the list elements, that works
fine, but the scroll amount needs to be adjusted as well and I think
changing that is not as easy...
Has somebody done that? If not, I'd like to request that feature,
respectively I will have to do that mod anyway... :-)
i disappeard from the list for a while because i had to sort some
things out. But i worked on a complete new version of jCarousel which
does exactly what you want. Its still in a alpha state but i've setup
an example page:
http://sorgalla.com/projects/jcarousel-preview/examples/static.html
There are a lot of api and configuration changes so just ask if
something isn't clear.
Jan
Hi Jan, thanks for the fast answer! Unfortunately the example is not
what I need, I was unclear apparently.
What I need is to have a flexible carousel with a constant amount of
items to be shown, for example 3.
So if the window gets bigger, the list items as well as the clipped
element will get bigger (as if they had a width given in %), and the
amount of px to scroll left/right has to as well then.
-- Klaus
Here's what I did - it's a hack and you could do better but it works for
now and you get the picture:
I added a flexibleWidth option and than added the following lines to the
init method:
// Mod - allow flexible width
if (priv.o.flexibleWidth)
jQuery(window).bind('resize', function() {
var jCarouselClip = jQuery(".jcarousel-clip", priv.scope);
var jCarouselClipAvailWidth =
parseInt(jCarouselClip[0].parentNode.offsetWidth - 2 * 40);
jCarouselClip.css({ width: jCarouselClipAvailWidth });
jCarouselClip.find('li').css({ width:
Math.ceil(jCarouselClipAvailWidth / priv.o.itemVisible) });
priv.dimension = i.offsetWidth + priv.margin(i, "marginLeft") +
priv.margin(i, "marginRight");
priv.resize();
priv.animate(); // readjust left positioning
});
Would be cool if you could add that in a more proper way if you like
that :-)
Cheers, Klaus
