> I've implemented the Jquery.Carousel on our site. I'm stumped on how
> to load content dynamically, however.
OK, I made some progress. I can now get data to load, though I'm
pretty sure my syntax is way off. I've also ran into an issue with
carousel.add. Here's the code:
My carousel initially has 6 LIs and 3 shown. I then set up the carousel as such:
$("#mycarousel1").jcarousel({
scroll: 2,
itemLastInCallback: appendItemsToCarousel
});
I don't think 'itemLastInCallback' is correct, as it's called after
each scroll. So, that's the first question. Is there a way to have the
callback ONLY call if the last item comes into view?
That said, here's the callback function:
function appendItemsToCarousel(carousel, state){
if(carousel.last==carousel.options.size){
$.get("getMovies.xml",{},function(xml){
$('movie',xml).each(function(i) {
var movieHTML;
var j = carousel.options.size;
movieHTML = '<img src="' +
$(this).find("posterURL").text() + '" />';
movieHTML = movieHTML +
$(this).find("title").text() + ' #' + j
+ '<br />';
movieHTML = movieHTML +
$(this).find("releaseDate").text();
carousel.add(j+1, movieHTML);
});
});
};
};
Since my callback is called after each scroll, I do a check comparing
the length of the LIs to the index of the last LI visible. If it
matches, then I know the last item came into view and I go get the XML
and append it to the list.
This is where it breaks. As you can see I'm using 'J+1' as the index
for the new item. this does not work. No error, but no item is added
either. If I just use 'j', the script successfully works but,
obviously, just replaces with last current item with the new one,
rather than actually appending new LIs.
Any suggestions/obvious mistakes above?
Thanks!
-DA