jquery 圆形旋转图片滚动切换效果

今回给大家介绍个圆形旋转的效果，基于圆形的物理特性，又圆上任意一点可以作为一个控制按钮，然后拖动它来使图片轮换。

这个效果比较特别，可爱，所以在外面网站没怎么看到过，有兴趣的朋友可以下载后自己使用。
PS: 经过修改已经兼容大众浏览器。
效果图:

在线演示：http://demo.0133.cn/js/ImagesRotateScroll/index.html
Step1. 创建HTML

Step2. 创建CSS

 
#rotatescroll { 
width: 300px; 
height: 300px; 
margin: 0 auto; 
position: relative; 
} 
#rotatescroll .viewport{ 
width: 300px; 
height: 300px; 
position: relative; 
margin: 0 auto; 
overflow: hidden; 
} 
#rotatescroll .overview { 
width: 798px; 
position: absolute; 
list-style: none; 
margin: 0; 
padding: 0; 
left: 0; 
top: 0; 
} 
#rotatescroll .overview li { 
width: 300px; 
height: 300px; 
float: left; 
position: relative; 
} 
#rotatescroll .overlay { 
height: 300px; 
width: 300px; 
background: url(../images/bg-rotatescroll.png-600) no-repeat 0 0; 
position: absolute; 
left: 0; 
top: 0; 
} 
#rotatescroll .thumb { 
width: 26px; 
height: 26px; 
z-index: 200; 
background: url(../images/bg-thumb.png-600) no-repeat 50% 50%; 
position: absolute; 
top: 0px; 
cursor: pointer; 
left: 0px; 
} 
#rotatescroll .dot { 
background: url(../images/bg-dot2.png-600) no-repeat 0 0; 
display: none; 
height: 12px; 
width: 12px; 
position: absolute; 
left: 155px; 
top: 3px; 
z-index: 100; 
} 
#rotatescroll .dot span { display: none; } 