二级菜单jquery导航插件nav
1、 效果：
[img]http://dl.iteye.com/upload/picture/pic/76743/e7baabfd-f7e8-3a3c-87ce-41bc753fad9e.jpg[/img]
2、 Nav 插件使用方法：
第一步：导入css和js
第一步：调用插件
1）、静态数据使用：
2）、动态url请求数据使用：
以上两种方式都必须有一个前提，那就是在页面中有：
3、参数说明
1、 效果：
[img]http://dl.iteye.com/upload/picture/pic/76743/e7baabfd-f7e8-3a3c-87ce-41bc753fad9e.jpg[/img]
2、 Nav 插件使用方法：
第一步：导入css和js
<link href="css/menu.css" rel="stylesheet" type="text/css"></link>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="nav-1.0.js"></script>
第一步：调用插件
1）、静态数据使用：
<script type="text/javascript">
$(function(){
// 文档就绪
$("#nav").nav({
target:'mainFrame',//链接目标
data:{"totalCount":2,"result":[{"name":"XX管理","childs":[{"name":"子菜单1",href:"common/singleItem.jsp?title=子菜单1"},{"name":"子菜单2",href:"common/singleItem.jsp?title=子菜单1"}]},{"name":"XX管理","childs":[{"name":"子菜单1",href:"common/singleItem.jsp?title=子菜单1"},{"name":"子菜单2",href:"common/singleItem.jsp?title=子菜单1"}]}]}
});
});
</script>
2）、动态url请求数据使用：
<script type="text/javascript">
$(function(){
// 文档就绪
$("#nav").nav({
target:'mainFrame',//链接目标
timeout:60,//url请求方式下的超时时间
url:'data.json'
});
});
</script>
以上两种方式都必须有一个前提，那就是在页面中有：
<body>
<div id="nav"></div>//看到这个id是不是和上面jquery取的id相同
</body>
3、参数说明
target:'mainFrame', //链接目标,值可以是:
_blank 在新窗口中打开被链接文档。
_self 默认。在相同的框架中打开被链接文档。
_parent 在父框架集中打开被链接文档。
_top 在整个窗口中打开被链接文档。
framename 在指定的框架中打开被链接文档。
timeout:60,//url请求方式下的超时时间
url:'data.json'
//json 数据请求路径url
data: 'json格式的数据'
//json格式的数据
注意：这里注意在1.4中，jQuery使用了更严格的方法来解析json。
所有的内容都必须使用双引号。
可以参考：[url]http://hi.baidu.com/proglife/blog/item/c5384e03c8991384d53f7cca.html[/url]
912
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
