使用hovertree菜单作为后台导航

hovertree是一个jquery菜单插件,官方网址:http://keleyi.com/jq/hovertree/ ,可以登录该网址体验效果。

0.1.3版本:http://keleyi.com/jq/hovertree/demo/demo.0.1.3.htm

hovertree插件包含文件:

http://keleyi.com/jq/hovertree/css/jquery.hovertree.0.1.3.min.css

http://keleyi.com/jq/hovertree/js/jquery.hovertree.0.1.3.js

和一张小图片hovertree.png(包含在下面的asp.net项目中)

还要记得引入jquery文件:http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.2.min.js

最后的js代码:

<script type="text/javascript">
$("#keleyihovertree").hovertree({ "width": "keleyi", "initStatus": 'keleyi', "subMenuShowSpeed": 200,
"subMenuShowWay": "slidedown"
});
</script>

HoverTree菜单0.1.3增加弹出菜单的动态效果,可以是动态下拉,也可以是动态淡入。

HoverTree菜单0.1.3参数:

width: 'keleyi',// '200px'
isCloseOther: false, //当点击展开一个一级菜单时,关闭其他已经展开的一级菜单项。
initStatus: 'keleyi', //'keleyi'、'expand'或'close'。
subMenuShowWay: "show",弹出菜单的显示方式 fadeIn,slidedown,或show
subMenuShowSpeed: 0,弹出菜单的速度,越大越慢

hovertree同时也是一个asp.net开源项目,完全开放源代码,下载地址:http://hovertree.codeplex.com/

该项目使用.net 4.0开发,数据库是 sql server,C#语言。

目前已经初步实现了留言板功能,体验效果:http://h.keleyi.com/guestbook/

这是前台的效果,后台请下载源代码安装。

web前端资源:

http://www.cnblogs.com/jihua/p/webfront.html

上一篇:WCF--安全小见解...


下一篇:Hadoop大数据挖掘从入门到进阶实战