html中,通過
選單項2
選單項3
最外圍的中元素即為選單項1、選單項2、選單項3,下拉列表分別在各主選單之下,如果選單最外層為ul,一層每個主選單放在乙個li中,如果有子選單,在這個主選單的li中建立新的ul,再依次巢狀即可構建多層的選單。
css中
ul,li
ul.hmainlia
.hmain a
.hmain li a
.hmain ul
.hmain
html中引用js檔案jquery.js和menu.js,其中menu.js如下:
$(document).ready(function());
$(".hmain").hover(function(),function());
});/*
*修改主選單的指示圖示
*/ function changeicon(mainnode)else}}
這樣絢麗的下拉列表就完成了。實現很簡單,不過裡面的小知識點很零碎。例如:.main a和.main>a的不同之處,前者選擇使用.main的這個class的元素內容所有的a節點,後者只選擇.main的子節點中的a節點。
這樣的例子應用性很強,在**中使用讓介面顯得更加的美觀,例子才看3個,抓緊時間繼續看...
jquery下拉列表
由於需要 用以前發過的摺疊選單原始碼改了一下 做成了下拉列表 感覺還不錯 留著以後使用 首頁主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單.子選單.子選單.主選單.子選單.子選單.子選單.子選單....
jquery之動態級聯下拉列表
jquery之動態級聯下拉列表 jquery html 級聯下拉動態 在製作html頁面的時候,難免會遇到級聯下拉列表的顯示。比如最常見的 省 市 級聯下拉列表。首先是執行結果 下面是 可以詳細看看。無標題文件 title script src jquery 2.1.0.min.js script ...
jquery操作下拉列表select
jquery獲取select選擇的text和value 語法解釋 1.select id change function 為select新增事件,當選擇其中一項時觸發 2.var checktext select id find option selected text 獲取select選擇的tex...