用Jquery 仿VS 樣式的 導航欄外掛程式

在開發b/s 專案過程中，根據主介面設計要求，需要做乙個類似vs 左邊工具欄樣式的選單導航欄，在網上搜尋無果後，於是決定自已做乙個。

由於前台用jquery開發， 想到網上很多人用jquery做外掛程式，開發起來很方便。於是呼，我也照貓畫虎地瞎做乙個，限本人文采水平一般，只能貼**共享。

效果圖：

5* jquery 外掛程式 支援jquery 1.3.2 和1.10.2

6* 仿vs 左側工具導航欄樣式的選單工具欄外掛程式。7*/

8var toolstag =,

11 ,

12 13]

14};

15 (function

($) , options =$.extend(defaults, options),

21 tags =,

22 contents =,

23 tagname = "#tag",

24 contentname = "#toolscontent",

25 activetoolsindex = 0;

2627

var uld = $('',

5354

if (val.cative === 1)

58});

59};

60 $.each(tags, function

(i, val) );

7071 $(val).mouseover(function

(e) );

75var index =e.target.tabindex;

76 $(tags[index]).addclass("i_active");

77});

78 $(val).mouseout(function

(e) );

82 $(tags[activetoolsindex]).addclass("i_active");

83});

84});

8586

function

tags_setactive() );

90 $.each(contents, function

(i, val) );93}

94};

95 })(jquery);

html

html, body, div, p, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, caption, th, td, img, form, fieldset, legend, input, label, button, textarea 

html, body 
ul #tools_layout 
.t_toolstags 
.t_toolstags li 
.t_toolstags li,
.t_toolstags li.i_active 
.t_toolstags li 
.t_toolstags li.i_active 
.t_toolscontent 
.t_contentactive 
.hrtest 

第一次用JQUERY做導航欄目

css檔案 main left main left dt main left li main right dt.show menu dt.hidden menuhtml 檔案 my inquiries 新增公司資訊 新增客戶資訊 my products 公司資訊列表 客戶資訊列表 members 新...

jquery的屬性和樣式

1.attr 和prop attr 設定或返回被選元素的屬性值 attr 屬性名 獲取屬性 attr 屬性名,屬性值 設定屬性 span attr data id 1002 data id 1001 console.log span attr id 獲取id console.log span att...

jQuery的屬性和樣式

prop 獲取在匹配的元素集中的第乙個元素的屬性值。attr 屬性名 屬性值 設定屬性 全選全部選 change function 反選 change function 2 change function body form action span id span data id 1001 姓名 s...