可伸缩的菜单
<!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的項目進行隱藏、顯示，not(:last)的意思是不包括最后一行
$("li:gt(5):not(:last)").toggle();});});</script></head><body><div id="menu" class="menu_style"><ul><li><a href="#">手機通訊、數碼電器</a></li><li><a href="#">食品飲料、酒水、果蔬</a></li><li><a href="#">進口食品、進口牛奶</a></li><li><a href="#">美容化妝、個人護理</a></li><li><a href="#">母嬰用品、個人護理</a></li><li><a href="#">廚衛清潔、紙、清潔劑</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="#">電腦、外設、辦公用品</a></li><li class="btn"><input name="more_btn" type="button" value="展開或關閉菜單項" /></li></ul></div></body></html>
?
轉載于:https://www.cnblogs.com/atlj/p/8066134.html
總結
- 上一篇： 多线程，多进程，协程
- 下一篇： 30 整数中1出现的次数（从1到n整数中