• 设为首页
  • 加入收藏
  • 我要投稿
  • 联系站长
  • 网站模板技术交流
当前位置：模板网首页 > 特效插件 > 滚动图片 >  图片90°旋转过渡的正文

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

作者：网页模板
大小：0.375MB
点击次数：
发布时间：2014-04-25 10:44
分享到：

特效介绍

90°旋转过渡的jquery轮播效果图片90°旋转过渡的jquery轮播效果。点击左右按钮，图片会旋转90°并且渐隐，然后下一张或上一张会渐显。图片的旋转不会导致图片角度的改变，仍然正确显示。

使用方法

使用方法：
1、引入下面的css
<link rel="stylesheet" type="text/css" href="css/styles.css" />
2、引入下面的js和jQuery：
<script src="http://www.5imoban.net/download/jquery/jquery-1.8.3.min.js"></script>
<script src="js/jquery.rotate.js"></script>
<script src="js/script.js"></script>
3、在html的body里面加入下面的html代码：
<div id="slideShowContainer">
    <div id="slideShow">
        <ul>
            <li><img src="img/photos/1.jpg" width="100%" alt="Fish" /></li>
            <li><img src="img/photos/2.jpg" width="100%" alt="Ancient" /></li>
            <li><img src="img/photos/3.jpg" width="100%" alt="Industry" /></li>
            <li><img src="img/photos/4.jpg" width="100%" alt="Rain" /></li>
        </ul>
        </div>    
    <a id="previousLink" href="#">&raquo;</a>
    <a id="nextLink" href="#">&laquo;</a>
</div>
  • 本文标签：
  • 图片,旋转,过渡,的,jquery,轮播,效果,图片,旋转,
图片90°旋转过渡的jquery轮播效果效果预览 图片90°旋转过渡的jquery轮播效果本地下载
仿迅雷影视幻灯片轮播js代码
360°立体手机展示jquery图片轮播