可伸缩的菜单
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>可伸縮的菜單</title><script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script><style type="text/css">ul {list-style: none;padding: 5px;width: 210px;border: 1px solid red;}a {text-decoration: none;line-height: 30px;}.menu_style li {border-bottom: 1px solid #666;}</style><script type="text/javascript">$(function(){$("input[name=more_btn]").click(function(){//索引大于5的項目進(jìn)行隱藏、顯示，not(:last)的意思是不包括最后一行
$("li:gt(5):not(:last)").toggle();});});</script></head><body><div id="menu" class="menu_style"><ul><li><a href="#">手機(jī)通訊、數(shù)碼電器</a></li><li><a href="#">食品飲料、酒水、果蔬</a></li><li><a href="#">進(jìn)口食品、進(jìn)口牛奶</a></li><li><a href="#">美容化妝、個人護(hù)理</a></li><li><a href="#">母嬰用品、個人護(hù)理</a></li><li><a href="#">廚衛(wèi)清潔、紙、清潔劑</a></li><li id="menu_07" class="element_hide"><a href="#">家居家紡、鍋具餐具</a></li><li id="menu_08" class="element_hide"><a href="#">生活電器、汽車生活</a></li><li id="menu_09" class="element_hide"><a href="#">電腦、外設(shè)、辦公用品</a></li><li class="btn"><input name="more_btn" type="button" value="展開或關(guān)閉菜單項" /></li></ul></div></body></html>
?
轉(zhuǎn)載于:https://www.cnblogs.com/atlj/p/8066134.html
總結(jié)
- 上一篇： 多线程，多进程，协程
- 下一篇： 30 整数中1出现的次数（从1到n整数中