$(function () {//上菜單$("#ListTopUL li").hover(function () {//$(this).addClass("ListTopULhover");//$(this).siblings(this).removeClass("ListTopULhover");var i = $(this).index();document.title = i;$(".ListTopRight1").eq(i).show();$(".ListTopRight1").eq(i).siblings(".ListTopRight1").hide();});//左菜單$(".ListBodyLeftDiv").hover(function () {var a = $(this).children("a");a.addClass("ListBodyLeftDivAhover");var i = $(this).index();$(".listbodyRDiv1").eq(i).show();$(".listbodyRDiv1").eq(i).siblings(".listbodyRDiv1").hide();$("#listbodyRDiv").addClass("listbodyRDivborder");//增加一個邊框樣式}, function () {$(this).children("a").removeClass("ListBodyLeftDivAhover");});//中間內容$(".listbodyRDiv1").hover(function () {var i = $(this).index();$(".ListBodyLeftDiv").eq(i).addClass("ListBodyLeftDivhover");$(".ListBodyLeftDiv a").eq(i).addClass("ListBodyLeftDivAhover");$(this).show();//非常重要.上級隱藏自己在顯示一下!!$("#listbodyRDiv").addClass("listbodyRDivborder");//增加一個邊框樣式}, function () {var i = $(this).index();$(".ListBodyLeftDiv").eq(i).removeClass("ListBodyLeftDivhover");$(".ListBodyLeftDiv a").eq(i).removeClass("ListBodyLeftDivAhover");$(this).hide();$("#listbodyRDiv").removeClass("listbodyRDivborder");//增加一個邊框樣式});//leftdiv整體$("#ListBodyLeft").hover(function () {}, function () {$(".ListBodyLeftDiv").removeClass("ListBodyLeftDivhover");$(".listbodyRDiv1").hide();$("#listbodyRDiv").removeClass("listbodyRDivborder");//增加一個邊框樣式});})

轉載于:https://www.cnblogs.com/cxd1008/p/6372445.html

總結

以上是生活随笔為你收集整理的jquery之仿京东菜单的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。