首页 > 特效插件 > 滚动轮播 >  图片90°旋转过渡的jquery轮播效果正文

图片90°旋转过渡的jquery轮播效果

特效介绍
90°旋转过渡的jquery轮播效果

    图片90°旋转过渡的jquery轮播效果。点击左右按钮,图片会旋转90°并且渐隐,然后下一张或上一张会渐显。图片的旋转不会导致图片角度的改变,仍然正确显示。
使用方法
使用方法:
1、引入下面的css
1<link rel="stylesheet" type="text/css" href="css/styles.css" />
2、引入下面的js和jQuery:
2<script src="js/jquery.rotate.js"></script>
3<script src="js/script.js"></script>
3、在html的body里面加入下面的html代码:
01<div id="slideShowContainer">
02    <div id="slideShow">
03        <ul>
04            <li><img src="img/photos/1.jpg" width="100%" alt="Fish" /></li>
05            <li><img src="img/photos/2.jpg" width="100%" alt="Ancient" /></li>
06            <li><img src="img/photos/3.jpg" width="100%" alt="Industry" /></li>
07            <li><img src="img/photos/4.jpg" width="100%" alt="Rain" /></li>
08        </ul>
09        </div>   
10    <a id="previousLink" href="#">&raquo;</a>
11    <a id="nextLink" href="#">&laquo;</a>
12</div>