Rotating Image Slider

Tal vez suene muy reiterativo, pero todos los días me topo con algún desarrollo jQuery que me deja impresionado.

Hoy encontré Rotating Image Slider, un slide show de imágenes desarrollado con jQuery que muestra las imágenes en forma de abanico de una forma muy dinámica y vistosa.

EntradasRelacionados

4 Tips de Oracle para iniciarte en el mundo de la programación

Ventajas, desventajas y consejos al crear tu sitio web

Implementar Rotating Image Slider

........
// enlazar los archivos
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow'
rel='stylesheet' type='text/css' />
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon"/>
<script type="text/javascript">
.........
//HTMl que muestra el slideshow
<div class="content">
<h1>Rotating Image Slider</h1>
<div class="rm_wrapper">
<div id="rm_container" class="rm_container">
<ul>
<li data-images="rm_container_1" data-rotation="-15">
<img src="images/1.jpg"/></li>
<li data-images="rm_container_2" data-rotation="-5">
<img src="images/2.jpg"/></li>
<li data-images="rm_container_3" data-rotation="5">
<img src="images/3.jpg"/></li>
<li data-images="rm_container_4" data-rotation="15">
<img src="images/4.jpg"/></li>
</ul>
<div id="rm_mask_left" class="rm_mask_left"></div>
<div id="rm_mask_right" class="rm_mask_right"></div>
<div id="rm_corner_left" class="rm_corner_left"></div>
<div id="rm_corner_right" class="rm_corner_right"></div>
<h2>Fashion Explosion 2012</h2>
<div style="display:none;">
<div id="rm_container_1">
<img src="images/1.jpg"/>
<img src="images/5.jpg"/>
<img src="images/6.jpg"/>
<img src="images/7.jpg"/>
</div>
<div id="rm_container_2">
<img src="images/2.jpg"/>
<img src="images/8.jpg"/>
<img src="images/9.jpg"/>
<img src="images/10.jpg"/>
</div>
<div id="rm_container_3">
<img src="images/3.jpg"/>
<img src="images/11.jpg"/>
<img src="images/12.jpg"/>
<img src="images/13.jpg"/>
</div>
<div id="rm_container_4">
<img src="images/4.jpg"/>
<img src="images/14.jpg"/>
<img src="images/15.jpg"/>
<img src="images/16.jpg"/>
</div>
</div>
</div>
<div class="rm_nav">
<a id="rm_next" href="#" class="rm_next"></a>
<a id="rm_prev" href="#" class="rm_prev"></a>
</div>
<div class="rm_controls">
<a id="rm_play" href="#" class="rm_play">Play</a>
<a id="rm_pause" href="#" class="rm_pause">Pause</a>
</div>
</div>
</div>
........

Sitio/demo/descargar: tympanus.net/codrops/2011/04/28/rotating-image-slider