基于jQuery圆形轮播图特效插件

基于jQuery圆形轮播图特效插件

circleCarousel是一款jQuery圆形轮播图插件。该jQuery圆形轮播图插件能够生成一组围绕中心旋转的圆形轮播图,点击图片时会有炫酷的旋转动画

使用方法
在页面中引入jquery、circle.js和circle.css文件。

1
2
3
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/circle.js"></script>
<link rel="stylesheet" href="css/circle.css">

HTML结构
该jQuery圆形轮播图的HTML结构如下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<div>
    <div>
        <span data-tab="1">
     Item 1
     <span ></span>
        </span>
        <span data-tab="2">
     Item 2
     <span ></span>
        </span>
        <span data-tab="3">
     Item 3
     <span ></span>
        </span>
        <span data-tab="4">
     Item 4
     <span ></span>
        </span>
        <span data-tab="5">
     Item 5
     <span ></span>
        </span>
        ...
    </div>
 
    <div>
        <div>
            TEXT SAMPLE FOR ITEM 1
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 2
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 3
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 4
        </div>
        <div>
            TEXT SAMPLE FOR ITEM 5
        </div>
    </div>
</div>
当前内容只有登录了才能查看,如果您已经注册,请登录
1

发表评论