hovertree插件实现二级树形菜单（简单实用）
更新时间：2016年12月28日 11:14:38 作者：计划
hovertree是一个仿京东的树形菜单jquery插件，暂时有银色和绿色两种。本文将对此进行介绍。具有一定的参考价值，下面跟着小编一起来看下吧
hovertree是一个仿京东的树形菜单jquery插件，暂时有银色和绿色两种。
下载网址：http://wd.jb51.net:81//201612/yuanma/hovertree-0.1.2_jb51.rar
可以设置菜单宽度(width)，还可以设置是否最多只能有一个一级菜单展开(isCloseOther)。
isCloseOther的值为false 或者 true，设为true即成为手风琴菜单。
使用方法可以参考以下HTML源代码：
<!DOCTYPE html>
<html>
<head>
<title>hovertree</title><base target="_blank" />
<link href="http://keleyi.com/jq/hovertree/css/jquery.hovertree.css" type="text/css" rel="Stylesheet" />
<script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://keleyi.com/jq/hovertree/js/jquery.hovertree.js"></script>
</head>
<body>
<div id="keleyihovertree" class="hovertree">
<div class="item current">
<h3>
<b></b>Web前端</h3>
<ul>
<li><a href="http://keleyi.com/menu/jquery/">jquery</a></li>
<li><a href="http://keleyi.com/menu/javascript/">javascript</a></li>
<li><a href="http://keleyi.com/menu/html5/">html5</a></li>
<li><a href="http://keleyi.com/menu/webqd/">web前端</a></li>
<li><a href="http://keleyi.com/jq/">jQuery插件</a></li>
</ul>
</div>
<div class="item">
<h3>
<b></b>jQuery Plugins</h3>
<ul>
<li><a href="http://keleyi.com/keleyi/">keleyi菜单</a></li>
<li><a href="http://keleyi.com/jq/randomvisit/">RandomVisit</a></li>
<li><a href="http://keleyi.com/jq/zonemenu/">ZoneMenu菜单</a></li>
<li><a href="http://keleyi.com/jq/myslider/">myslider</a></li>
<li><a href="http://keleyi.com/jq/hovertree/">hovertree</a></li>
</ul>
</div>
<div class="item">
<h3>
<b></b>工具</h3>
<ul>
<li><a href="http://tool.keleyi.com/t/md5.htm">MD5加密</a></li>
<li><a href="http://keleyi.com/tool/md5.htm">MD5加密（Silverlight）</a></li>
<li><a href="http://keleyi.com/tool/htmlencode.htm">HTML编码与解码</a></li>
<li><a href="http://keleyi.com/tool/urldecode.htm">URL编码与解码</a></li>
<li><a href="http://keleyi.com/tool/regex.htm">.NET正则表达式匹配工具</a></li>
<li><a href="http://tool.keleyi.com/ip/wodeip.htm">查看IP地址</a></li>
</ul>
</div>
</div>
<a href="hovertreegreen.htm">Green Style</a> <a href="http://plugins.jquery.com/hovertree/">download</a>
<script type="text/javascript">
$("#keleyihovertree").hovertree({ "width": "200px"});
</script>
</body>
</html>
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持脚本之家！
相关文章
这篇文章主要介绍了jQuery中removeAttr()方法用法,实例分析了removeAttr()方法的功能、定义及从匹配元素中移除相应属性的使用技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了jQuery模拟新浪微博首页滚动效果的方法,实例分析了jQuery使用animate、css等方法实现滚动特效的技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
使用CSS 制作导航菜单，实际主要是利用了css的li a属性，对于以后用css制作更绚丽的效果提高了很好的参考。2010-08-08
jQuery提供了一些方法，使流程变为生成jQuery对象A，操作jQuery对象A；更改为jQuery对象B，操作jQuery对象B2012-09-09
这篇文章主要介绍了Jquery 动态添加元素并添加点击事件实现过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-10-10
这篇文章主要为大家详细介绍了jQuery查找和过滤的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-07-07
本文将介绍如何使用npm安装和使用jQuery,帮助读者解决相关问题,并提供示例代码,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-11-11
下面小编就为大家带来一篇浅谈jQuery框架Ajax常用选项。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-07-07![jQuery中[attribute!=value]选择器用法实例](//img.jbzj.com/images/xgimg/bcimg8.png)
jQuery中[attribute!=value]选择器用法实例
这篇文章主要介绍了jQuery中[attribute!=value]选择器用法,实例分析了[attribute!=value]选择器匹配不包含指定属性元素的使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了jQuery插件kinMaxShow扩展效果用法,实例分析了kinMaxShow扩展的使用技巧,非常具有实用价值,需要的朋友可以参考下2015-05-05
![jQuery中[attribute!=value]选择器用法实例](http://img.jbzj.com/images/xgimg/bcimg8.png)
最新评论