Jquery中文网 > jQuery > jquery 教程 > 正文 jQuery版仿Path菜单效果

jQuery版仿Path菜单效果

发布时间：2013-06-07 编辑：www.jquerycn.cn

昨日在一个前端网站上看见了一个老外写的纯用css3做的仿Path菜单，心里痒痒，于是也用jQuery写了一个，现在分享给大家

昨日在一个前端网站上看见了一个老外写的纯用css3做的仿Path菜单，心里痒痒，于是也用jquery写了一个，现在分享给大家使用方法:
　　　　1.依次引用jquery.1.7.1,jQueryRotateCompressed.2.1.js(旋转插件),jquery.path.1.0.js(我自己写的Path插件)
　　　　2.页面元素采用如下格式

复制代码代码如下:

 
<div id="content"> 
<div>单击我</div> 
<div>★</div> 
<div>★</div> 
<div>★</div> 
<div>★</div> 
<div>★</div> 
</div> 

最外层为父级包裹div，内部第一个div为需要单击元素，剩余的是Path菜单元素
3.只需一小段代码

复制代码代码如下:

 
$(document).ready(function (){ 
$('#content').path({ 
radius: 100, //半径 
radian: 90, //弧度 
duration: 200//动画时间 
}); 
}); 

4.enjoy yourself!
附
插件下载
jQueryRotateCompressed.2.1.js(旋转插件)　　
jquery.path.1.0.js(Path插件)
脚本之家打包下载

您可能感兴趣的文章：
jQuery版仿Path菜单效果
 jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
 jquery 插件之仿“卓越亚马逊”首页弹出菜单效果
 jQuery菜单插件 Smooth Navigational Menu
CSS Dock Menu
CSS3和jQuery实现花瓣网固定顶部位置悬浮菜单效果
 jQuery实现的类flash菜单效果代码
 jQuery水平下拉菜单 jMenu
简单易用的基于jQuery版仿新浪微博向下滚动效果(附DEMO)
7款风格新颖的jQuery/CSS3菜单导航分享

上一篇：jquery focus(fn),blur(fn)方法实例代码下一篇：整理8个很棒的 jQuery 倒计时插件和教程

[关闭]

jQuery版仿Path菜单效果

最近更新

浏览排行