演示：http://www.websjy.com/club/websjy_index/29/
代码 <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > < html xmlns ="http://www.w3.org/1999/xhtml" > < head > < meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" /> < meta name ="keywords" content ="JS代码,菜单导航,JS广告代码,JS特效代码" /> < title > 淘宝网顶部导航菜单_懒人图库 </ title > < LINK href ="http://www.websjy.com/club/websjy_index/29/css/css.css" rel =stylesheet > < SCRIPT src ="http://www.websjy.com/club/websjy_index/29/js/taobao.js" ></ SCRIPT > </ head > < body style ="text-align:center" > < div id =page > < div class ="chl-poster simple" id =header > < div id =site-nav > < UL class =quick-menu > < LI class =home >< A href ="#" > 淘宝网首页 </ A > </ LI > < LI >< A href ="#" > 我要买 </ A ></ LI > < LI class ="mytaobao menu-item" > < div class =menu > < A class =menu-hd href ="#" target =_top rel =nofollow > 我的淘宝 < B ></ B ></ A > < div class =menu-bd > < div class =menu-bd-panel > < div > < A href ="#" rel =nofollow > 已买到的宝贝 </ A > < A href ="#" rel =nofollow > 已卖出的宝贝 </ A > </ div > </ div > < S class =r ></ S >< S class =rt ></ S >< S class =lt ></ S >< S class =b ></ S >< S class ="b b2" ></ S >< S class =rb ></ S >< S class =lb ></ S > </ div > </ div > </ LI > < LI class =cart >< A href ="#" rel =nofollow >< S ></ S > 购物车 </ A ></ LI > < LI class =favorite >< A href ="#" rel =nofollow > 收藏夹 </ A ></ LI > < LI class ="search menu-item" > < div class =menu >< SPAN class =menu-hd >< S ></ S > 搜索 < B ></ B ></ SPAN > < div class =menu-bd > < div class =menu-bd-panel > < FORM name =topSearch action =http://s.taobao.com/search?ssid=s0 >< INPUT maxLength =60 name =q >< BUTTON type =submit > 搜 索 </ BUTTON > < INPUT type =hidden value =newsearch name =shopf > </ FORM > </ div > < S class =r ></ S >< S class =rt ></ S >< S class =lt ></ S >< S class =b ></ S >< S class ="b b2" ></ S >< S class =rb ></ S >< S class =lb ></ S > </ div > </ div > </ LI > < LI class ="services menu-item last" > < div class =menu > < A class =menu-hd href ="#" target =_top > 网站导航 < B ></ B ></ A > < div class =menu-bd style ="WIDTH: 210px; HEIGHT: 262px; _width: 202px" > < div class =menu-bd-panel > < DL > < DT >< A href ="#" > 购物 </ A > < DD > < A href ="#" > 商城 </ A > < A href ="#" > 电器城 </ A > < A href ="#" > 嗨淘 </ A > < A href ="#" > 全球购 </ A > < A href ="#" > 跳蚤街 </ A > < A href ="#" > 礼物 </ A > < A href ="#" > 促销 </ A > < A href ="#" > 机票 </ A > < A href ="#" > 彩票 </ A > < A href ="#" > 创意 </ A > </ DD > </ DL > < DL > < DT >< A href ="#" > 门户 </ A > < DD >< A href ="#" > 服饰 </ A > < A href ="#" > 女人 </ A > < A href ="#" > 美容 </ A > < A href ="#" > 居家 </ A > < A href ="#" > 男人 </ A > < A href ="#" > 数码 </ A > < A href ="#" > 亲子 </ A > < A href ="#" > 时尚 </ A > < A href ="#" > 试用 </ A > < A href ="#" > 心得 </ A > < A href ="#" > 帮派 </ A > < A href ="#" > 画报 </ A > < A href ="#" > 淘女郎 </ A > < A href ="#" > 社区 </ A > < A href ="#" > 宝贝传奇 </ A > </ DD > </ DL > < DL > < DT >< A href ="#" > 淘江湖 </ A > < A href ="#" > 手机淘宝 </ A > </ DT ></ DL > < DL > < DT >< A href ="#" > 帮助中心 </ A > < DD >< A href ="#" > 交易安全 </ A > < A href ="#" > 维权中心 </ A > </ DD ></ DL > < DL class =last > < DD >< STRONG style ="FONT-WEIGHT: bold" >< A href ="#" > 更多内容 </ A ></ STRONG ></ DD > </ DL > </ div > < S class =r ></ S >< S class =rt ></ S >< S class =lt ></ S >< S class =b style ="WIDTH: 169px" ></ S >< S class ="b b2" style ="WIDTH: 169px" ></ S >< S class =rb ></ S >< S class =lb ></ S > </ div > </ div > </ LI > </ UL > </ div > </ div > </ div > < SCRIPT type =text/javascript > TB.Header.init(); </ SCRIPT > </ body > </ html >
转载于:https://www.cnblogs.com/websjy/archive/2010/08/23/1806156.html
相关资源：淘宝网顶部导航菜单制作