很酷的菜单-jQuery Wheel 环形菜单插件5种效果演示

在线预览

下载地址

实例代码

  1. <div class="container">
  2. <!-- Top Navi -->
  3. <div class="header">
  4. <h1>jQuery Wheel 环形菜单插件 Demo 1: Default Settings</h1>
  5. </div>
  6. <div class="menu">
  7. <a class="active" href="index.html">Demo 1</a>
  8. <a href="index2.html">Demo 2</a>
  9. <a href="index3.html">Demo 3</a>
  10. <a href="index4.html">Demo 4</a>
  11. <a href="index5.html">Demo 5</a>
  12. </div>
  13. <div class="main">
  14. <a href="#wheel" class="wheel-button">
  15. <i class="customicon-plus"></i>
  16. </a>
  17. <div class="pointer">Click me</div>
  18. <ul id="wheel">
  19. <li class="item"><a href="#home"><i class="customicon-home"></i></a></li>
  20. <li class="item"><a href="#home"><i class="customicon-music"></i></a></li>
  21. <li class="item"><a href="#home"><i class="customicon-video"></i></a></li>
  22. <li class="item"><a href="#home"><i class="customicon-heart"></i></a></li>
  23. <li class="item"><a href="#home"><i class="customicon-user"></i></a></li>
  24. <li class="item"><a href="#home"><i class="customicon-trash"></i></a></li>
  25. <li class="item"><a href="#home"><i class="customicon-envelope"></i></a></li>
  26. <li class="item"><a href="#home"><i class="customicon-camera"></i></a></li>
  27. <li class="item"><a href="#home"><i class="customicon-picture"></i></a></li>
  28. <li class="item"><a href="#home"><i class="customicon-eye-open"></i></a></li>
  29. </ul>
  30. </div>
  31. </div><!-- Container -->
  32. <script type="text/javascript">
  33. $(".wheel-button").wheelmenu();
  34. </script>

  

jQuery Wheel 环形菜单插件5种效果演示的更多相关文章

  1. jQuery自定义漂亮的下拉框插件8种效果演示

    原始的下拉框不好看这里推荐一个jQuery自定义漂亮的下拉框插件8种效果演示 在线预览 下载地址 实例代码 <!DOCTYPE html> <html lang="en&q ...

  2. jQuery下拉框插件8种效果

    jQuery自定义漂亮的下拉框插件8种效果 jquery美化选择器实例有:边框.下划线. 伸缩 .滑动. 覆盖. 旋转. 弹出层选择 .环形效果. 在线预览 <body class=" ...

  3. jQuery超酷下拉插件6种效果演示

    原始的下拉框很丑啦, 给大家一款jQuery超酷下拉插件6种效果 效果预览 下载地址 实例代码 <div class="container"> <section ...

  4. jQuery瀑布流从不同方向加载3种效果演示

    很实用的一款插件jQuery瀑布流从不同方向加载3种效果演示在线预览 下载地址 实例代码 <section class="grid-wrap"> <ul clas ...

  5. jQuery自定义漂亮的下拉框插件8种效果

    jquery美化选择器实例有:边框.下划线. 伸缩 .滑动. 覆盖. 旋转. 弹出层选择 .环形效果. 在线预览 实例代码 <body class="demo-1"> ...

  6. jQuery仪表盘指示器动画插件 6种仪表样式

    土豆网同步更新:http://www.tudou.com/plcover/VHNh6ZopQ4E/   使用HTML 创建Mac OS App 视频教程. 官方QQ群: (1)App实践出真知 434 ...

  7. jQuery下拉菜单插件Tendina.

    插件效果: 下载地址和文档: https://github.com/iprignano/tendina

  8. jQuery 树型菜单插件(Treeview)

    jQuery Treeview 提供了一个无序灵活的可折叠的树形菜单.试用于一些菜单的导航,支持基于 cookie 的持久性菜单

  9. 适合移动手机使用的js环形菜单特效插件

    blooming-menu是一款适合在移动手机上使用的js环形菜单插件.该环形菜单提供了众多的參数,通过结合CSS3动画制作出效果很炫酷的圆形菜单展开和隐藏动画效果. 以下是这个圆形菜单菜价的可用參数 ...

随机推荐

  1. javascript中可变值与不可变值(原始值)

    字符串原始值修改不了1 var str = "abc"; 2 str[0] = "d"; 3 console.log(str[1]="f") ...

  2. Object.create

    var emptyObject = Object.create(null); var emptyObject = Object.create(null); var emptyObject = {}; ...

  3. CSS绝对定位的应用

    × 目录 [1]跟随图标 [2]视频提示 [3]下拉菜单[4]边缘对齐[5]星号 [6]全屏适应[7]半区翻图[8]九宫格[9]等高布局[10]整体布局 前面的话 之前的博客文章已经详细介绍过绝对定位 ...

  4. Android开发之注册登录

    昨天给大家介绍了一下关于Android端向服务器端发送数据的方法,不过貌似有一点瑕疵,今天经过调试已经解决,在这里给大家介绍一下 貌似Android4.0以后版本的对于网络权限要求变得严格,导致昨天编 ...

  5. JSP网站开发基础总结《十三》

    继上一篇为大家补充过滤器类后,本篇为大家简单介绍一下如何实现验证码效果.验证码的作用是什么呢?1.防止恶意注册2.防止恶意提交3.防止盗取账户等等,总的来说验证码的存在就是为了,防止非人为的操作,不过 ...

  6. Oracle Dataguard之物理standby的基本配置

    尽管网上有很多Oracle Dataguard的配置教程,但不难发现,很多采用的是rman duplicate这种方法,尽管此种方法较为简便.但在某种程度上,却也误导了初学者,虽说也能配置成功,但只知 ...

  7. shell脚本学习心得

    近来主要捣鼓ubuntu,大多数项目中都用到了sh脚本作为启动脚本等,以前只是大概明白如何使用,今天需要自己修改并运行脚本就碰到了很多问题,所以决定静下心来学习一下shell脚本,学习了几个小时,现将 ...

  8. Magic CSS3 – 创建各种神奇的交互动画效果

    Magic CSS3 Animations 动画是一个独特的 CSS3 动画特效包,你可以自由地使用您的 Web 项目中.只需简单的在页面上引入 CSS 样式: magic.css 或者压缩版本 ma ...

  9. Android SlidingMenu 仿网易新闻客户端布局

    前面两篇文章中的SlidingMenu都出现在左侧,今天来模仿一下网易新闻客户端左右两边都有SlidingMenu的效果,以下是网易新闻客户端效果: 不扯闲话了,直接进入正题吧 frame_conte ...

  10. 2.SDK目录结构和adb工具及命令介绍

    安卓开发学习笔记 1.安卓开发之环境搭建 2.SDK目录结构和adb工具及命令介绍 1.SDK目录介绍: ******************************** add-ons:Androi ...