效果图：

Roundabout是一个转换静态HTML元素结构为交互式播放区域的jQuery插件（而且并不仅仅是一个转盘，还有许多的形状）

首先你要下载好Jquery.min.js,和Jquery-Roundabout.min.js，我会在文件里上传。

然后直接给上源代码。duration是转的快慢，值越大， 转的越慢。还有一些其他功能，详见百度Jquery-roundabout。

<head>

<style type="text/css">

body{ text-align:center;}

#featured-area{ height:200px; width:200px; margin: auto; padding-top:500px;}

#featured-area ul li{ height:100px; width:100px; background:#F00; color:#FFF;}

</style>

<script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript" src="jquery.roundabout-1.0.min.js"></script>

<script type="text/javascript">

$(function(){

           $('#featured-area ul').roundabout({

                                        duration:

                                             });

           })

</script>

</head>

<body>

<div id="featured-area" >

<ul>

<li>box3</li>

<li>box2</li>

<li>box1</li>

</ul>

</div>

</body>

</html>

Roundabout for jQuery的更多相关文章

  1. jquery.roundabout.js图片叠加3D旋转

    Roundabout是一个jQuery插件能够将一组静态HTML元素转换成可以灵活定制具有类似于转盘旋转效果的交互区域.有多种旋转形状可供选择.官方说明:roundabout.js是一个jQuery插 ...

  2. 33个好用的图片轮显 jquery图片轮显

    原文发布时间为:2011-05-28 -- 来源于本人的百度文章 [由搬家工具导入] 我个人还是喜欢 jquery.recycle，比较通用。因为由美工设计好的轮显结构，如果套用下面，就感觉不是很方便 ...

  3. js实现左右点击图片层叠滚动特效

    需要加载js有 <script type="text/javascript" src="js/jquery-1.7.2.min.js"></s ...

  4. jquery.roundabout.js实现3D图片层叠旋转木马切换

    最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js. 兼容性如图: html结构代码: <div id="featured-area& ...

  5. jquery roundabout幻灯片插件3d图片切换支持图片旋转切换滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. jquery.roundabout.js图片叠加3D旋转插件多功能图片翻转切换效果

    http://www.17sucai.com/pins/4880.html DEMO演示地址:http://www.17sucai.com/pins/demoshow/4880

  7. roundabout插件使用（3d旋转轮播图）兼容IE8

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. jquery 插件大全

    1.jquery.roundabout.js 超棒的左右3D旋转式幻灯片jQuery插件 2.jquery validate.js 验证表单 3.jquery ui插件 对话框 日期 4.lhgdia ...

  9. 轮播图3D效果--roundabout（兼容IE8）升级版

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. Cocos2d-X 使用CCTableView创建滚动视图

    CCTableView和CCScrollView如创建滚动视图,CCTableView该函数将是更,制造更多麻烦 实例1:使用CCTableView创建滚动视图 首先创建一个TableView类 Ta ...

  2. C/C++综合測试题(三)

    又刷了一套题 这些题都是百度.阿里巴巴.腾讯.网易.新浪等公司的面试原题,有一定的难度.只是确实相当有水平,能够通过做题来查漏补缺. 1.补充以下函数代码: 假设两段内存重叠,用memcpy函数可能会 ...

  3. C该结构变化 struct typedef

     这几天看代码,看到若干类型的结构,例如下列结构声明: struct    book{ string name; int price; int num; }; 此种结构定义结构变量的格式例如以下: ...

  4. SQL Tuning Health-Check Script (SQLHC)

    1. 纯手工打造 工具:程序员的双手 特点:手写客户端与服务器端验证代码 2. 半手工半自动 工具:jquery.validate(客户端) + DataAnnotations & DataA ...

  5. SQL SERVER 内存分配及常见内存问题（2）——DMV查询

    原文:SQL SERVER 内存分配及常见内存问题(2)--DMV查询 内存动态管理视图(DMV): 从sys.dm_os_memory_clerks开始. SELECT [type] , SUM(v ...

  6. CloudFoundry.yml修订

    --- name: CFRELEASE02 director_uuid: fdd46e30-f2c5-41dc-9662-0976fdac5716 releases: - name: cf versi ...

  7. Android： ADT 23.0.2

    http://pan.baidu.com/s/1gdnBUUJ 版权声明:本文博主原创文章.博客,未经同意不得转载.

  8. 普及windows流氓程序和监控软件

    win7下载更改后无黑屏windows7激活程序v1.0 一个立即安装 美女主播节目,和流行的色情垃圾邮件 安装程序,结果装了很多垃圾节目,输入.日历.文件等. 重新启动机器后,,会弹出广告. .他的 ...

  9. UC浏览器插件开发

    pip install UC浏览器插件是个什么玩意? 如图所看到的,便是UC的插件面板. UC通过开放浏览器插件api, 使开发人员可以进行插件的开发. 插件种类: 1 : extension. 就是 ...

  10. 汉高澳大利亚sinox2014电影播放flash最好的办法是安装游戏windows文本firefox

    事实上,韩澳sinox本身是没有原生flashplayer,无论怎么捣鼓,它们是从adobe弄linux要么windows版本号flashplayer,它不停地拨弄linux版本号flashplaye ...