YUI recommends YUI3.

YUI 2 has been deprecated since 2011. This site acts as an archive for files and documentation.

This documentation is no longer maintained.

YUI Library Examples: Carousel Control: Circular Carousel example

Carousel Control: Circular Carousel example

This example showcases a simple circular Carousel. The isCircular configuration setting can be used to make a Carousel "circular" — meaning that, once the last item on the Carousel is selected, the "next" item will be the first item.

In this example, you can use arrow keys to select items as well as click on an item to select it. These are built-in features of the YUI Carousel Control.

Making the Carousel Widget to display items in a loop

Here we will use the YUI Carousel Control's isCircular configuration setting to make the Carousel into a loop.

This example has the following dependencies:

This example uses progressive enhancement to build the Carousel from an ordered list of elements.

We'll have only one CSS rule to set the height for the Carousel items.

Since we have the elements in place, we can invoke the Carousel's constructor with the isCircular configuration to create the widget.

Copyright © 2013 Yahoo! Inc. All rights reserved.

Privacy Policy - Copyright Policy - Job Openings