jQuery UI Coverflow Demo

This demonstrates is a very basic implementation, see more advanced usage scenarios, the administration console, and a standalone cover example at our coverflow demo site.

Muse, The Resistance Alberta Cross, Broken Side of Time Bat For Lashes, Two Suns Bjork, Post Gorillaz, Plastic Beach Chemical Brothers, Dig Your Own Hole Cibo Matto, Viva La Woman Cornershop, When I Was Born for the 7th Time Cream, Disraeli Gears Cut Copy, Zonoscope Delerium, Nuages Du Monde Iron Maiden, The Final Frontier Bonobo, Black Sands Elbow, Asleep in the Back Iron Butterfly, In-a-Gadda-Da-Vida

The Code:

<div id="coverflow" class="coverflow">
    <!-- Coverflow uses all img tags in the container not nested in other elements.
    The alt tags are not used by coverflow, but should be rendered to be standards compliant and accessible. -->
    <img src="/Media/Default/products/jquery-coverflow/albums/muse-the-resistance.jpg" alt="Muse, The Resistance" data-subtitle="Muse" data-title="The Resistance" />
    <img src="/Media/Default/products/jquery-coverflow/albums/albertacross-thebrokensideoftime.jpg" alt="Alberta Cross, Broken Side of Time" data-subtitle="Alberta Cross" data-title="Broken Side of Time" />
    <img src="/Media/Default/products/jquery-coverflow/albums/batforlashes-twosuns.jpg" alt="Bat For Lashes, Two Suns" data-subtitle="Bat For Lashes" data-title="Two Suns" />
    <img src="/Media/Default/products/jquery-coverflow/albums/bjork-post.jpg" alt="Bjork, Post" data-subtitle="Bjork" data-title="Post" />
    <img src="/Media/Default/products/jquery-coverflow/albums/gorillaz-plasticbeach.jpg" alt="Gorillaz, Plastic Beach" data-subtitle="Gorillaz" data-title="Plastic Beach" />
    <img src="/Media/Default/products/jquery-coverflow/albums/chemicalbrothers-digyourownhole.jpg" alt="Chemical Brothers, Dig Your Own Hole" data-subtitle="Chemical Brothers" data-title="Dig Your Own Hole" />
    <img src="/Media/Default/products/jquery-coverflow/albums/cibomatto-vivalawoman.jpg" alt="Cibo Matto, Viva La Woman" data-subtitle="Cibo Matto" data-title="Viva La Woman" />
    <img src="/Media/Default/products/jquery-coverflow/albums/cornershop-wheniwasbornfortheseventhtime.jpg" alt="Cornershop, When I Was Born for the 7th Time" data-subtitle="Cornershop" data-title="When I Was Born for the 7th Time" />
    <img src="/Media/Default/products/jquery-coverflow/albums/cream-disraeligears.jpg" alt="Cream, Disraeli Gears" data-subtitle="Cream" data-title="Disraeli Gears" />
    <img src="/Media/Default/products/jquery-coverflow/albums/cut-copy-zonoscope.jpg" alt="Cut Copy, Zonoscope" data-subtitle="Cut Copy" data-title="Zonoscope" />
    <img src="/Media/Default/products/jquery-coverflow/albums/delerium-nuagesdumonde.jpg" alt="Delerium, Nuages Du Monde" data-subtitle="Delerium" data-title="Nuages Du Monde" />
    <img src="/Media/Default/products/jquery-coverflow/albums/ironmaiden-thefinalfrontier.jpg" alt="Iron Maiden, The Final Frontier" data-subtitle="Iron Maiden" data-title="The Final Frontier" />
    <img src="/Media/Default/products/jquery-coverflow/albums/bonobo-blacksands.jpg" alt="Bonobo, Black Sands" data-subtitle="Bonobo" data-title="Black Sands" />
    <img src="/Media/Default/products/jquery-coverflow/albums/elbow-asleepintheback.jpg" alt="Elbow, Asleep in the Back" data-subtitle="Elbow" data-title="Asleep in the Back" />
    <img src="/Media/Default/products/jquery-coverflow/albums/ironbutterfly-in-a-gadda-da-vida.jpg" alt="Iron Butterfly, In-a-Gadda-Da-Vida" data-subtitle="Iron Butterfly" data-title="In-a-Gadda-Da-Vida" />
</div>
<script type="text/javascript">// <![CDATA[
    $(function () {
        $("#coverflow").coverflow({
            selectedIndex: 7,
            cover: {
                background: {
                    style: "White"
                }
            },
            slider: {
                enabled: false
            }
        });
    });
// ]]></script>