jquery 多级无限分类
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> xx </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style>
#linNav{position:absolute;z-index:1000;}
#linNav ul,li{padding:0;margin:0;}
#linNav ul li{float:left;margin-right:1px; display:inline;list-style:none;text-align:center;width:45px;font-size:12px;}
#linNav ul li ul li{float:none;display:block;position:relative;}
#linNav ul li ul{display:none;}
#linNav ul a{line-height:18px;height:18px;}
#linNav ul li ul li .aaa{position:absolute;left:45px;top:0;}
#linNav ul li ul li .aaa li{float:none;}
.bbb{background:#ffff00;}
</style>
<script src="js/jquery-1.7.1.min.js" /></script>
</head>
<body>
<div id="linNav">
<ul>
<li><a href="">index</a></li>
<li><a href="">栏目二</a>
<ul>
<li><a href="">子栏目1</a></li>
<li><a href="">子栏目2</a>
<ul class="aaa">
<li><a href="">子栏目3</a></li>
<li><a href="">子栏目3</a>
<ul class="aaa">
<li><a href="">子栏目3</a></li>
<li><a href="">子栏目3</a>
</li>
</ul>
</li>
<li><a href="">子栏目3</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<br style="clear:both;" />
</div>
<br />
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
<script>
$(document).ready(function(){
$("ul li").hover(function(){
$(this).find("ul:first").show();//鼠标滑过查找li下面的第一个ul然后显示;
},function(){
$(this).find("ul:first").hide();//鼠标离开隐藏li下面d的ul;
})
$("ul li ul li ul").prev().addClass("bbb");//给li下面ul是aaa的样式的前一个同辈元素添加css;
})
</script>
</body>
</html>
jquery 多级无限分类的更多相关文章
- laravel-nestedset:多级无限分类正确姿势
laravel-nestedset:多级无限分类正确姿势 laravel-nestedset是一个关系型数据库遍历树的larvel4-5的插件包 目录: Nested Sets Model简介 安 ...
- 后台树状菜单,js实现递归无限分类
//新闻类别管理 public function new_classify() { $arr = M('news_classify')->where("fid = 0")-& ...
- MySql无限分类数据结构--预排序遍历树算法
MySql无限分类数据结构--预排序遍历树算法 无限分类是我们开发中非常常见的应用,像论坛的的版块,CMS的类别,应用的地方特别多. 我们最常见最简单的方法就是在MySql里ID ,parentID, ...
- Infinite Scroll - jQuery & WP 无限滚动插件
无限滚动(Infinite Scroll)也称为自动分页.滚动分页和无限分页.常用在图片.文章或其它列表形式的网页中,用来在滚动网页的时候自动加载下一页的内容.Infinite Scroll 这款 ...
- jQuery实现无限加载瀑布流特效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- TreeView递归绑定无限分类数据
TreeView递归绑定无限分类数据 实现一个动态绑定,无限级分类数据时,需要将数据绑定到TreeView控件,分类表的结构是这样的: 字段 类型 Id int ParentId int Name N ...
- 关于无限分类的树状输出(id,name,pid)类型的
首先创建无限分类的数据表,我这里采用的是id.name.pid这种类型(当然还有很多种无限分类的方式了,比如:id.name.pid.path.left.right左右节点的形式) CREATE TA ...
- php递归方法实现无限分类实例
数组: 代码如下 复制代码 $items = array( array('id' => 1, 'pid' => 0, 'name' => '一级11' ), array('id' ...
- PHP+Mysql无限分类的方法汇总
无限分类是个老话题了,来看看PHP结合Mysql如何实现.第一种方法这种方法是很常见.很传统的一种,先看表结构表:categoryid int 主键,自增name varchar 分类名称pid in ...
随机推荐
- [置顶] mysql中的set和enum类型的用法和区别
mysql中的enum和set其实都是string类型的而且只能在指定的集合里取值, 不同的是set可以取多个值,enum只能取一个值. CREATE TABLE `20121101_t` ( ...
- BZOJ 3280: 小R的烦恼 & BZOJ 1221: [HNOI2001] 软件开发
3280: 小R的烦恼 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 399 Solved: 200[Submit][Status][Discuss ...
- 什么是Scale Up和Scale Out?
导读:Scale Out(也就是Scale horizontally)横向扩展,向外扩展 Scale Up(也就是Scale vertically)纵向扩展,向上扩展 无论是Scale Out,Sca ...
- ibm rational software architect download
keep secret: rational software architect download: http://public.dhe.ibm.com/software/rationalsdp/v8 ...
- 【16】成对使用new和delete时要采取相同形式
简而言之,new时不带[],delete时也不带[]:new时带[],delete时也要带[].如果不匹配,要么造成多销毁对象,导致未定义行为:要么导致少销毁对象,导致内存泄漏.
- [转]Reducing script compile time or a better workflow to reduce excessive recompiling
http://forum.unity3d.com/threads/148078-Reducing-script-compile-time-or-a-better-workflow-to-reduce- ...
- ApkTool动态打包
引言: APK在推广的时候可能会须要动态打包APK.比方公布到不同渠道的时候,须要在manifest文件里改动渠道信息.或者app在推广的时候.须要在apk包里面加上推广人信息等. 环境变量: 1.J ...
- <Android>从窗口泄漏谈android:configChanges属性
今天有幸去哥们的大公司做了半天的暂时工,一个偶现的Bug折腾了他好久,好不easy今天抓到了异常Log日志.大致的意思就是android.view.windowleaked--窗口泄漏.我在网上查了资 ...
- int& a = b 的思考
在PCL显示点云部分程序中,涉及到了如下程序 // 定义相关变量 pcl::PointCloud<pcl::PointXYZ>::Ptr cloud_ptr (new pcl::Point ...
- 引用js或css后加?v= 版本号的用法(转)
<span style="font-size:14px;">css和js带参数(形如.css?v=与.js?v= 或 .css?version=与.js?version ...