轮菜单

所属分类:导航-其他导航

 49646  466  查看评论 (4)
分享到微信朋友圈
X
轮菜单 ie兼容

轮菜单是一个jQuery插件,可以帮您实现一个增加完全可定制的路径轮菜单按

使用步骤

要添加这个,只需在您的网站包括最新的jQuery库在这里找到一起到你的文档的<head> jquery.wheelmenu.js和wheelmenu.css的,按照由HTML标记和函数调用如下:

<a href="#wheel2" class="wheel-button ne">
 <span>+</span>
</a>
<ul id="wheel2" class="wheel">
  <li class="item"><a href="#home">A</a></li>
  <li class="item"><a href="#home">B</a></li>
  ...
</ul>

确保HREF的ID相匹配的UL

$(".wheel-button").wheelmenu({
  trigger: "hover", 
  animation: "fly", 
  animationSpeed: "fast", 
  angle: "all", 
});

进一步定制

你可以申请有了jquery.wheelmenu.js,每个单独的元素用不同的角度,通过简单地增加一个数据角度到您的文档中的UL如下:

<a href="#wheel2" class="wheel-button ne">
 <span>+</span>
</a>
<ul id="wheel2" data-angle="NE" class="wheel">
  <li class="item"><a href="#home">A</a></li>
  <li class="item"><a href="#home">B</a></li>
  ...
</ul>

您也可以使用数组作为角代表的出发点和落脚点菜单就会出现在哪里。例如,使用阵列使菜单出现360度,你可以使用[0,360]作为一个角度。随意发挥与数字,以获得最佳的结果。


不要忘记删除的角度,从这里看到的全局选项:

$(".wheel-button").wheelmenu({
  trigger: "hover",
  animation: "fly", 
  animationSpeed: "fast"
});

现在,每个元素都会有自己的效果,而无需多次调用该函数。

相关插件-其他导航

jQuery顶部导航固定

jQuery向下滚动页面顶部导航固定特效,多种展示效果。
  其他导航
 36211  435

纯CSS3多级环形导航菜单(原创)

使用纯css3开发的多级环绕导航菜单,扩展方便。
  其他导航
 52837  523

手机移动端可滚动的导航代码

这是一款基于移动端滑动导航
  其他导航
 59243  483

路径菜单path-menu

巨牛逼的用css3完成的导航!
  其他导航
 41605  406

讨论这个项目(4)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    sixfish 0
    2015/7/18 14:07:54
    皮囊 0
    2014/9/3 10:14:05
    JQ剑圣 0
    2014/5/22 9:43:00
    JQ剑圣 0
    2013/12/8 17:49:00
    超霸气的一个滚轮菜单 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复