Windy 图片切换插件

Windy  图片切换插件130
Windy  图片切换插件131
Windy  图片切换插件132
windy 是一个jQuery插件,使用CSS 3D变换和转换来略过一堆物品从而实现快速导航。连续导航的效果就是提醒一副牌或表单快点飞走,因此得名Windy。这个插件的想法是受CSS着色器示例 的影响。

使用步骤
使用这个插件时需要一个无序列表的class:“wi-container”

<ul id="wi-el" class="wi-container">
    <li>
        <img src="images/demo1/1.jpg" alt="image1"/>
        <h4>Coco Loko</h4>
        <p>Total bicycle rights in blog four loko raw denim ex</p>
    </li>
    <li> <!-- ... --> </li>
    <li> <!-- ... --> </li>
    <li> <!-- ... --> </li>
    <!-- ... --> 
</ul>
可以这样调用:
$( '#wi-el' ).windy();
下面是可选项:
// the options
$.Windy.defaults = {
    nextEl : '',
    prevEl : '',
    boundaries : {
        rotateX : { min : 40 , max : 90 },
        rotateY : { min : -15 , max : 15 },
        rotateZ : { min : -10 , max : 10 },
        translateX : { min : -200 , max : 200 },
        translateY : { min : -400 , max : -200 },
        translateZ : { min : 250 , max : 550 }
    }
};

也许你还喜欢