[jQuery] jCarousel, click link to load different number of contents
Hi all,
When my site first loads shows jCarousel with two images.
In the site I have three links, clicking link 1 makes jCarousel to
show 12 images, clicking link 2 shows 2 images and link 3 shows 7
images.
The problem:
The width of the <ul> element is the one to fit the 2 initial
images.
So if I click link 1 instead of 12 images, I get to see just 2.
The same for link 3, instead of 7 images I see 2.
The carousel is set to show 6 images at the time.
So if the width of one element is 127px, I do the multiplication and I
apply it to the <ul> via jquery's css, I get to see just 6 images for
link 1 and link 3 because next button is disabled (the next button is
not enabled as it still "thinks" that there are just two images in the
carousel as when the site loaded for the first time).
The question:
Is the approach of adding the width to the <ul> element via jquery
correct? If so, how can I enable the next button for when there's more
than 6 images?
I've been able to enable the next button by adding
mycarousel_nextItemCallback(); after $("#playlistInner").css
({"width" : ""+wid+"px" }); but though the button is enabled there's
no functionality :(
function mycarousel_nextItemCallback()
{
jQuery(".jcarousel-next").attr({ disabled: "false" });
jQuery(".jcarousel-next").removeClass("jcarousel-next-disabled");
jQuery(".jcarousel-next").removeClass("jcarousel-next-disabled-
horizontal");
}
If the previous approach is not correct, what can I do to fix this
width issue? Please help, I'm clueless.
Please take into account that the number of images that the links/
first load show will change dynamically (feed dynamically by
webservice calls), so hardcoded fixes with numberOfElements won't do :
(
The code with absolute paths is in:
http://www.vt-psoe.com/2.html
(please use view page source)
Thanks a lot!