I use jCarousel for creating a scroll content (follow this http://sorgalla.com/projects/jcarousel/). However I dont want to use the default next and previous button so I want to create 2 buttons for handling the click event. EX: I have 2 hyperlinks like these:
<script>
jQuery(document).ready(function() {
// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
jQuery('#scrollArea').jcarousel({
scroll: 10
});
</script>
<a>NEXT</a>
<a>PREV</a>
<div id="scrollArea">
<!-- CONTENT HERE -->
</div>
How can I bind the next and prev functions to above links?
Check out this example:
http://sorgalla.com/projects/jcarousel/examples/static_controls.html
Basically, you can attach functions to the carousel in the initialization for the carousel. Here is the relevant snippet.
function mycarousel_initCallback(carousel) {
jQuery('#mycarousel-next').bind('click', function() {
carousel.next();
return false;
});
jQuery('#mycarousel-prev').bind('click', function() {
carousel.prev();
return false;
});
};