Can anyone please help me how to implement vertical jCarousel by using ajax.
A:
Answer to this question can be easily found on the first pages of jCarousel docs, but okay, I'll copy it here for you ;)
First of all download jCarousel and add all the sources to your <head>
tag.
<script type="text/javascript" src="/path/to/jquery-1.2.1.pack.js"></script>
<script type="text/javascript" src="/path/to/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="/path/to/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="/path/to/skin/skin.css" />
Then in the place where you want your carousel put this code.
<ul id="mycarousel" class="jcarousel-skin-name">
<!-- The content goes in here -->
</ul>
Then add js code to initialize your carousel.
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
// Carousel gonna be vertical
vertical : true,
// AJAX callback
itemLoadCallback: itemLoadCallbackFunction
});
});
</script>
Then you need to create itemLoadCallBackFunction to actually load new items into carousel dynamically. Basicly once you get some item with index i
you just insert it to carousel with carousel.add(i, item)
.
UPD:
Here is an example with PHP script inside, you can get some inspiration from there.
freiksenet
2009-07-13 20:25:18