效果图：

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. C指针决心 ------ 指针的概念和元素

     本文是自己学习所做笔记,欢迎转载,但请注明出处:http://blog.csdn.net/jesson20121020 指针在C语言中的地位,不用多说. 指针的概念 指针是一个特殊的变量,它里面存储 ...

  2. 华为OJ:查找字符的第一个字符串只出现一次

    您可以使代码有点写得真好,不要直接写双循环,如果,是可能的写函数调用,非常高的可重用性. import java.util.Scanner; public class findOnlyOnceChar ...

  3. MD5和Base64

    一. 简述 MD5: 全称为message digest algorithm 5(信息摘要算法), 能够进行加密, 可是不能解密, 属于单向加密, 通经常使用于文件校验 Base64: 把随意序列的8 ...

  4. JBoss配置解决高并发连接异常问题(转)

    这两天一个项目在做压力测试的时候,发现只要并发数超过250个,连续测试两轮就会有连接异常出现,测试轮数越多出现越频繁,异常日志如下: Caused by: com.caucho.hessian.cli ...

  5. 【转】JAVA 网络编程

    网络编程 网络编程对于很多的初学者来说,都是很向往的一种编程技能,但是很多的初学者却因为很长一段时间无法进入网络编程的大门而放弃了对于该部分技术的学习. 在 学习网络编程以前,很多初学者可能觉得网络编 ...

  6. js 自己容易搞混的笔记查询

    相似的操作 var str2 = "0123456789"; console.log(str2.slice(4,7)); //------------"456" ...

  7. 不一样的是不一样的，我的独家滚动条------Day35

    在您开始建立自己的,感觉应该先录一个概念:内核的浏览器. 兼容性问题之前多次提及,而在平时经常会遇到兼容性问题.原因,就在于它:浏览器内核.这是比較通俗的说法,事实上应该把它描写叙述的专业点:Rend ...

  8. android利用jdk制作签名

    Apk签名首先要有一个keystore的签名用的文件. keystore是由jdk自带的工具keytool生成的.详细生成方式參考一下: 開始->执行->cmd->cd 到你安装的j ...

  9. capturing self strongly in this block is likely to lead to a retain cycle

    一个用Block实例变量语法,当有一个参考的实例变量,常引起retain cycle. capturing self strongly in this block is likely to lead ...

  10. C# - Abstract Classes

     Abstract classes are closely related to interfaces. They are classes that cannot be instantiated, ...