原创

hovertree是一个仿京东的树形菜单jquery插件，暂时有银色和绿色两种。

官方网址：http://keleyi.com/jq/hovertree/
欢迎下载使用

查看绿色效果：
http://keleyi.com/jq/hovertree/hovertreegreen.htm

可以设置菜单宽度(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>

本文转自：http://keleyi.com/a/bjad/6alcx1xr.htm

web前端：http://www.cnblogs.com/jihua/p/webfront.html

简单实用的二级树形菜单hovertree的更多相关文章

  1. 简单实用的下拉菜单（CSS+jquery）

    原文 简单实用的下拉菜单(CSS+jquery) 没什么可以说的,直接上例子 html+jquery代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...

  2. Android学习笔记之树形菜单的应用...

    PS:终于考完试了,总算是解脱了...可以正式上手项目开发了.... 学习内容: 1.掌握如何使用树形菜单...   对知识点进行一下补充...居然忘记了去学习树形菜单...不过在这里补上... Ex ...

  3. Android 多级树形菜单

    在Android里要实现树形菜单,都是用ExpandableList(也有高手自己继承ListView或者LinearLayout来做),但是ExpandableList一般只能实现2级树形菜单... ...

  4. 实用的树形菜单控件tree

     jQuery plugin: Treeview  这个插件能够把无序列表转换成可展开与收缩的Tree. jQuery plugin: Treeview  jQuery  jstree  jsTree ...

  5. JS实现的简单横向伸展二级菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. CSS之简单树形菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 一个基于jQuery的简单树形菜单

    在工作中的项目使用的是一个前端基于 jQuery easyui 的一个系统,其中左侧的主菜单使用的是 easyui 中的 tree 组件,不是太熟悉,不过感觉不是太好用. 比如 easyui 中的 t ...

  8. 仿京东树形菜单插件hovertree

    hovertree是一个仿京东的树形菜单jquery插件,暂时有银色和绿色两种. 官方网址:http://keleyi.com/jq/hovertree/欢迎下载使用 查看绿色效果:http://ke ...

  9. 构建简单的json树形菜单

    json结构: var Menu = [{ tit:"一级菜单", submenu:[{ tit:"二级菜单", url:"", func: ...

随机推荐

  1. 如何用注解简化SSH框架

    一.简化代码第一步,删除映射文件,给实体类加上注解 @Entity //声明当前类为hibernate映射到数据库中的实体类 @Table(name="news") //声明tab ...

  2. Android Studio自动删除多余的import

    在开发过程中,随着项目的迭代,文件内部分import 可能早已经不用了,对于这种无用的 import,我们不可能一个一个文件的删除.这里记录个自动删除无用import的功能. 一 .开发环境: And ...

  3. 阿里云centos7搭建wordpress环境

    阿里云搭建wordpress系统 一.购买阿里云 二.安装php开发环境 1． https://www.apachefriends.org/zh_cn/index.html网站下载linux下的xam ...

  4. Security5：Execute AS 和 impersonate 权限

    principal 是统称,包括login,user,role等,可以向作为安全主体的用户授予权限,principal分为server level和database level. 登录名是Server ...

  5. 解决升级Win 10 IP 10122后无法调试UAP应用的方法

    可能各位也像老周一样,第一时间升级了Build 10122,但不知道大家有没有发现,当你升级后,写一个UAP应用,要调试运行时,就会出错,错误如下: DEP0730 : 注册应用程序失败,因为目标计算 ...

  6. Android 对程序异常崩溃的捕捉

    转载博客:http://blog.csdn.net/i_lovefish/article/details/17719081 以下为异常捕捉处理代码: import java.io.BufferedRe ...

  7. .NET平台机器学习组件-Infer.NET(三) Learner API—数据映射与序列化

             所有文章分类的总目录:http://www.cnblogs.com/asxinyu/p/4288836.html 微软Infer.NET机器学习组件:http://www.cnblo ...

  8. 【实时】DevExpress内存监视

    前言 在做项目的时候,我们有时候需要检测项目的内存占用情况,有时候是检测内存泄露~,有时候是查看某段代码执行前后的内存对比,以方便找出问题并以解决. 内存泄漏也称作“存储渗漏”,用动态存储分配函数动态 ...

  9. 利用免费的Spire.XLS控件制作Excel报表

    我们小组上个季度接手了一个项目其中需要实现创建excel文档的功能,寻找实现这个功能的控件的任务分配给了我,通过百度搜索我找到了一个免费的控件,它是由E-iceblue公司推出的spire.xls控件 ...

  10. 設置Linux保留物理內存並使用 （1）

    在Linux系統中可以通過memblock來設置系統保留物理內存,防止這些內存被內存管理系統分配出去. 作者: 彭東林 郵箱: pengdonglin137@163.com 平臺 硬件平臺: TQ24 ...