var mycarousel_itemList = [ {url: '/uploadedFiles/File/productsAutos_Image_1354054800_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354054799.JPG', title: 'a'},{url: '/uploadedFiles/File/productsAutos_Image_1354055905_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354055904.JPG', title: 'b'},{url: '/uploadedFiles/File/productsAutos_Image_1354055928_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354055927.JPG', title: 'c'},{url: '/uploadedFiles/File/productsAutos_Image_1354056039_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354056037.JPG', title: 'e'},{url: '/uploadedFiles/File/productsAutos_Image_1354056062_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354056061.JPG', title: 'f'},{url: '/uploadedFiles/File/productsAutos_Image_1354056079_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354056077.JPG', title: 'g'},{url: '/uploadedFiles/File/productsAutos_Image_1354056093_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354056092.JPG', title: 'h'},{url: '/uploadedFiles/File/productsAutos_Image_1354056254_tn.JPG', link: '/uploadedFiles/File/productsAutos_Image_1354056253.JPG', title: 'i'}]; function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt) { // The index() method calculates the index from a // given index who is out of the actual item range. var idx = carousel.index(i, mycarousel_itemList.length); carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1])); }; function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt) { carousel.remove(i); }; /** * Item html creation helper. */ function mycarousel_getItemHTML(item) { return '' + item.title + ''; }; jQuery(document).ready(function() { jQuery('#mycarousel').jcarousel({ wrap: 'circular', itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback}, itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback} }); showImage("/uploadedFiles/File/productsAutos_Image_1354054799.JPG"); }); /* To Put The Image In */ function showImage(src) { $("#loader").addClass("loading"); $("#loader img").fadeOut("slow").remove(); var img = new Image(); $(img).load(function () { $(this).hide(); $('#loader').removeClass('loading').append(this); $(this).fadeIn("slow"); }).error(function () { // notify the user that the image could not be loaded }).attr('src', src); }