旋转手柄切换图片jQuery+CSS图片轮播特效

旋转手柄切换图片jQuery+CSS图片轮播特效，鼠标拖动外环的红色手柄，可以左右切换圆环内的图片。兼容IE6。 1、在head区引入下面的代码

<link rel="stylesheet" type="text/css" href="css/index.css" />
<!--[if lte IE 6]>
    <style type="text/css">
    /* Internet Explorer 6 PNG transparency fix */
    #rotatescroll1 .overlay { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bg-rotatescroll.png", sizingmethod='scale'); }
    #rotatescroll1 .thumb { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bg-thumb.png", sizingmethod='scale'); }
    </style>
<![endif]-->
<!-- The JavaScript -->
<script type="text/javascript" src="http://www.5imoban.net/download/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/jquery.tinycircleslider.js"></script>
<script type="text/javascript" src="js/website.js"></script>

2、在body区域引入下面的代码：

<div id="rotatescroll1">
    <div class="viewport">
        <ul class="overview">
            <li><img src="images/SF1.jpg" alt="Chun-Li" /></li>
            <li><img src="images/SF2.jpg" alt="VEGA" /></li>
            <li><img src="images/SF3.jpg" alt="DHAISIM" /></li>
            <li><img src="images/SF4.jpg" alt="KEN" /></li>
            <li><img src="images/SF5.jpg" alt="BALROG" /></li>
            <li><img src="images/SF6.jpg" alt="CAMMY" /></li>
            <li><img src="images/SF7.jpg" alt="GOUKI" /></li>
            <li><img src="images/SF8.jpg" alt="BLANKA" /></li>
            <li><img src="images/SF9.jpg" alt="HONDA" /></li>
            <li><img src="images/SF10.jpg" alt="FEI LONG" /></li>
            <li><img src="images/SF11.jpg" alt="GUILE" /></li>
            <li><img src="images/SF12.jpg" alt="RYU" /></li>
            <li><img src="images/SF13.jpg" alt="SAGAT" /></li>
            <li><img src="images/SF14.jpg" alt="THWAK" /></li>
            <li><img src="images/SF15.jpg" alt="ZANGIEF" /></li>
        </ul>
    </div>
    <div class="overlay"></div>
    <div class="thumb"></div>
</div>

部分素材资源来源网站，本站提供免费下载，如有侵权请联系站长马上删除！