Code Sample
<link rel="stylesheet" href="agile_carousel.css" type='text/css'> <div class="slideshow" id="flavor_2"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.js"></script> <script src="agile_carousel/agile_carousel.a1.js"></script> <script> $.getJSON("agile_carousel/agile_carousel_data.json", function(data) { $(document).ready(function(){ $("#flavor_2").agile_carousel({ carousel_data: data, carousel_outer_height: 330, carousel_height: 230, slide_height: 230, carousel_outer_width: 480, slide_width: 480, transition_type: "fade", transition_time: 600, timer: 3000, continuous_scrolling: true, control_set_1: "numbered_buttons,previous_button, ... (continues on same line) ... pause_button,next_button", control_set_2: "content_buttons", change_on_hover: "content_buttons" }); }); }); </script>
Agile development tool: This page is shows the JQuery Agile Carousel Plugin with a variety of controls, including those that change on hover. The plugin is intended for agile development. Easily build and customize a rotating banner for your agile web development process.