在项目中遇到的需求，效果是仿淘宝的。写出来和他家分享下，很简单的东西。^_^
只是初始状态；
这是点击后效果。首相分析下需求：
1，首先在页面中创建导航，单击标题的时候，隐藏内容，同时小图标也改变。
2，单击更多的时候，显示隐藏的链接内容，并将"更多"变成"简化"，改变小图标，并高亮部分链接。
下面是完整代码：
复制代码 代码如下:
*{ margin:0;padding:0;}
body{ font-size:13px;}
#wraper{ border:1px solid #ccc; width:301px; overflow:hidden;}
#wraper .Head{ background;#eee; padding:8px; height:18px; cursor:pointer;}
#wraper .Head h3{ float:left;}
#wraper .Head span{ float:right; margin-top:3px;}
#wraper .Content{ padding:8px;}
#wraper .Content ul{ list-style:none; list-style-type:none;}
#wraper .Content ul li{ float:left; width:95px; height:23px; line-height:23px;}
#wraper .Bot{ float:right; padding-top:5px; padding-bottom:5px;}
.GetFocus{ background:#eee;}
.one{ color:#ff8000;}
图书分类
- 小说(1000)
- 文艺(1000)
- 知音(1000)
- 少儿(1000)
- 生活(1000)
- 社科(1000)
- 广利(1000)
- 美女(1000)
- 儿童(1000)
- 老人(1000)
- 少年(1000)
- 青年(1000)
- 成年(1000)
- 女人(1000)
- 父亲(1000)
- 木青(1000)
- 母亲(1000)
- 妹妹(1000)
- 其他(1000)
更多
