〜直接コードに、難しいことではありません
コメントを書きます
<!DOCTYPE HTML> <HTML LANG = "EN"> <HEAD> <メタ文字コード= "UTF-8"> <メタ名= "ビューポート"コンテンツ= "幅=装置幅、初期の規模= 1.0"> <メタHTTP-当量= "X-UA-互換性のある"コンテンツ= "IE =エッジ"> <タイトル>ドキュメント</ TITLE> <スタイル> * {マージン:0;パディング:0 ;} UL {リスト - スタイル:なし。 } / * 清除所有UL的小圆点* / .banner { マージン:は50px自動。幅:333px; 高さ:30px; 背景:URL( "画像/ bg.jpg")NO- 繰り返し。 } 。 / * すべてのLiの背景画像を追加* / .banner > UL> 李{ フロート:左;マージン:0 5pxのを;位置:相対; } / * ULはDIVスタイルのLiの下に設けられた* / A { 表示:ブロック;幅:100ピクセル;高さ:30px; テキスト - 装飾:なし;色:黒; ライン -height:30px;テキストベースが並ぶ=左:センター; } / * 設定下線のスタイルを削除* / .second { 位置:絶対に、トップ: 30px;表示:なし; / * トップ:30px;メニュー30pxので高さは、トップカバーメニューが0になりますである* / } .second {リー パディング:5pxの13px; } </スタイル> </ HEAD> <BODY> <DIV CLASS = "バナー"> <UL> <LI> 。<a href="">の</a>のメニュー1 <= ULクラス"SECOND"> <LI>二次メニュー。1 </ LI> <LI>二次メニュー。1 </ LI> <LI>二次メニュー。1 </ LI> </ UL> </ LI> <LI> <A href = "">メニュー</a>の2 <ULクラス= "SECOND"> <李>二次メニュー2 </ LI> <LI>の2つのメニュー2 </ LI> <LI>の2つのメニュー2 </ LI> </ UL> MouseEnter( 関数(){ $(この).find( "UL")、CSS( "表示"、 "ブロック" ); }); // 李の下に表示UL二次メニューにマウスの前のメニューのli div要素にイベントをサインアップ $( "バナー> UL>李")。MouseLeave(関数(){ $(この).find(「UL ")の.css("表示を実行する""なし」); }); // divの中に前のメニュー李登録されたイベントには、ULマウスは、二次メニュー李の下に隠れて左 }); </ SCRIPT> < / BODY> </ HTML>