hovertree插件实现二级树形菜单(简单实用)

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

下载网址::81//201612/yuanma/hovertree-0.1.2_jb51.rar

可以设置菜单宽度(width),还可以设置是否最多只能有一个一级菜单展开(isCloseOther)。

isCloseOther的值为false 或者 true,设为true即成为手风琴菜单。

hovertree插件实现二级树形菜单(简单实用)

hovertree插件实现二级树形菜单(简单实用)

使用方法可以参考以下HTML源代码:

<!DOCTYPE html> <html> <head> <title>hovertree</title><base target="_blank" /> <link href="https://keleyi.com/jq/hovertree/css/jquery.hovertree.css" type="text/css" /> <script type="text/javascript" src="https://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="https://keleyi.com/jq/hovertree/js/jquery.hovertree.js"></script> </head> <body> <div> <div> <h3> <b></b>Web前端</h3> <ul> <li><a href="https://keleyi.com/menu/jquery/">jquery</a></li> <li><a href="https://keleyi.com/menu/javascript/">javascript</a></li> <li><a href="https://keleyi.com/menu/html5/">html5</a></li> <li><a href="https://keleyi.com/menu/webqd/">web前端</a></li> <li><a href="https://keleyi.com/jq/">jQuery插件</a></li> </ul> </div> <div> <h3> <b></b>jQuery Plugins</h3> <ul> <li><a href="https://keleyi.com/keleyi/">keleyi菜单</a></li> <li><a href="https://keleyi.com/jq/randomvisit/">RandomVisit</a></li> <li><a href="https://keleyi.com/jq/zonemenu/">ZoneMenu菜单</a></li> <li><a href="https://keleyi.com/jq/myslider/">myslider</a></li> <li><a href="https://keleyi.com/jq/hovertree/">hovertree</a></li> </ul> </div> <div> <h3> <b></b>工具</h3> <ul> <li><a href="https://tool.keleyi.com/t/md5.htm">MD5加密</a></li> <li><a href="https://keleyi.com/tool/md5.htm">MD5加密(Silverlight)</a></li> <li><a href="https://keleyi.com/tool/htmlencode.htm">HTML编码与解码</a></li> <li><a href="https://keleyi.com/tool/urldecode.htm">URL编码与解码</a></li> <li><a href="https://keleyi.com/tool/regex.htm">.NET正则表达式匹配工具</a></li> <li><a href="https://tool.keleyi.com/ip/wodeip.htm">查看IP地址</a></li> </ul> </div> </div> <a href="https://www.jb51.net/hovertreegreen.htm">Green Style</a> <a href="https://plugins.jquery.com/hovertree/">download</a> <script type="text/javascript"> $("#keleyihovertree").hovertree({ "width": "200px"}); </script> </body> </html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwjjjz.html