I am attempting to create a dynamic gallery using jCarousel and Ajax. The thumbnails are being loaded from a '.txt' file. I am trying to achieve the following effect: When a thumbnail is clicked, the background of the body changes. This action should apply to all thumbnails, with each one changing the background to a different image. However, when I attempt to add dynamic URLs for different files, it doesn't work. If I manually change the URL to the correct path, it works fine. It seems that all thumbnails end up loading the same image from the specified path.
Below is my code:
function mycarousel_getItemHTML(url)
{
return '<img src="' + url + '" width="200" height="75" alt="" border="0" class="newbg" />';
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
scroll: 2,
itemLoadCallback: mycarousel_itemLoadCallback
});
$('.newbg').live("click", function(){
$('body').css('background-image', 'url(' + url + ')');
});
});
Does anyone have any ideas on how to modify this code to achieve the desired effects?