仿京东树形菜单插件hovertree
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>
转载于:https://www.cnblogs.com/double405/p/5174567.html
仿京东树形菜单插件hovertree相关推荐
- html jquery 菜单选中,jQuery树形菜单插件多级菜单选中代码
特效描述:jQuery 树形菜单插件 多级菜单选中.jQuery树形菜单插件,点击展开多级下拉菜单,点击选中菜单效果代码. 代码结构 1. 引入JS 2. HTML代码 打开 | 关闭 d = new ...
- jQuery仿京东无限级菜单HoverTree
官方网址:http://keleyi.com/jq/hovertree/ 效果图: 看了上面效果图,你或许已经明白为什么是仿京东菜单.如果还不明白,请访问http://list.jd.com/list ...
- Github 树形菜单插件
ajax显示gitlab的,很像mac的树形展示. 直接在左侧做了一个ajax的树,每次访问gitlab自动加载.非常方便呢,在国内网速这么慢的情况下更显得好用了. 下载地址: https://git ...
- 仿京东左侧菜单弹出html代码,相仿京东左侧菜单
Furniture * {margin:0; padding:0;} html {color:#434343; background-color:#fff;} body{color:#434343;f ...
- 仿京东左侧菜单弹出html代码,一个类似京东网页左侧菜单扩展的特效代码
Furniture * {margin:0; padding:0;} html {color:#434343; background-color:#fff;} body{color:#434343;f ...
- 简单实用的二级树形菜单hovertree
原创 hovertree是一个仿京东的树形菜单jquery插件,暂时有银色和绿色两种. 官方网址:http://keleyi.com/jq/hovertree/ 欢迎下载使用 查看绿色效果: http ...
- 仿京东、饿了么 左右联动菜单列表自定义View
仿京东.饿了么 左右联动菜单列表 这是一个左右联动的自定义View 这里本人将两个列表进行了联动封装,使用的时候调用方法即可,方便快捷,扩展性也强. 完整Demo传送门 效果图: 正题开始: 我们看一 ...
- 手机京东菜单html,jQuery仿京东商城手机端商品分类滑动切换特效
jQuery仿京东商城手机端商品分类滑动切换特效 一款仿京商城东手机移动端商品图片分类导航滑动效果,jQuery商品二级分类菜单切换特效. js代码 //设置cookie function setCo ...
- ECSHOP模板堂仿京东属性跳转插件,ecshop商品不同属性不同url插件,ecshop点击该属性跳到新页面
简介: 大家熟知的ECSHOP本身自带的功能在点选属性之后都是留在当前页面,充其量就是价格发生变化.模板堂仿京东属性跳转插件可在后台属性添加跳转商品ID即可实现商品详情页点击不同属性跳转到不同商品页面 ...
最新文章
- Java 压缩字符串
- php删除字段某个字段,php数如何组删除某个字段
- 使用MQTT与函数计算做热力图的实践
- QT之 Hello World
- logistic回归 如何_Logistic回归分析之二元Logistic回归
- JavaStudyNotes
- Python实现猜拳游戏
- 计算机求和便捷应用,4种常用求和方法 | Excel自动求和全攻略!
- 2013年台式计算机型号,2013cpu天梯图,台式机处理器天梯图
- Linux Cannot assign requested address
- C语言atan2()函数:求y/x的反正切值
- 以下是根据在下的一些朋友芳名作诗,请朋友指点,继续增加中
- 我,28岁程序员,没想到今年找工作这么难
- 默哀日、灾难日,纪念日,哀悼日等网站都变成黑白色
- 刷题/笔试常(自)用模板
- 抖音巨量引擎1 创建广告计划
- 开源中国广州源创会分享
- 朱有鹏 TCP协议(2)
- javaweb 投票系统
- 三星+android+u盘模式,三星手机usb存储器如何连接电脑的【详解】