我讨厌在这里发布问题，因为我想为自己找出一个解决方案但是我无法想出这个问题。
我有一个导航菜单，由wordpress吐出3深。我试图做一个很大的下拉菜单，我只是用css运行它很好，但现在我想给它制作动画，我只是遇到了问题。
这是一个jsfiddle：http://jsfiddle.net/yRNQt/
这是代码：
<div id="mid-nav">
<ul id="midnav">
<ul id="topmenu-{topmenu slug}[-{increment}]" class="topmenu">
<li id="nav-menu-item-62" class="main-menu-item menu-item-depth-0 menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-5 current_page_item"><a href="http://www.renewmywindows.com/" class="menu-link main-menu-link">Home</a></li>
<li id="nav-menu-item-68" class="main-menu-item menu-item-depth-0 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/why-renewal/" class="menu-link main-menu-link">Why Renewal</a>
<ul id="testtt" class="sub-menu menu-odd menu-depth-1">
<div id="special"><img src="images/Untitled-3.png" /></div>
<div id="contact"> <img src="images/Untitled-4.png" /></div>
<li id="nav-menu-item-69" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/why-renewal/fibrex/" class="menu-link sub-menu-link">Fibrex</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-70" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/why-renewal/fibrex/history-of-firex/" class="menu-link sub-menu-link">History of firex</a></li>
<li id="nav-menu-item-71" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/why-renewal/fibrex/what-is-fibrex/" class="menu-link sub-menu-link">What is fibrex</a></li>
</ul>
</li>
<li id="nav-menu-item-72" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/why-renewal/green-seal-cert/" class="menu-link sub-menu-link">Green Seal Cert</a></li>
<li id="nav-menu-item-75" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/why-renewal/renewal-warranty/" class="menu-link sub-menu-link">Renewal Warranty</a></li>
<li id="nav-menu-item-76" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/why-renewal/what-to-look-for/" class="menu-link sub-menu-link">What to look for</a></li>
</ul>
</li>
<li id="nav-menu-item-63" class="main-menu-item menu-item-depth-0 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/about/" class="menu-link main-menu-link">About</a>
<ul class="sub-menu menu-odd menu-depth-1">
<div id="special"><img src="images/Untitled-3.png" /></div>
<div id="contact"> <img src="images/Untitled-4.png" /></div>
<li id="nav-menu-item-148" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/about/our-pledge/" class="menu-link sub-menu-link">Our Pledge</a></li>
<li id="nav-menu-item-149" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/about/testimonials/" class="menu-link sub-menu-link">Testimonials</a></li>
<li id="nav-menu-item-146" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/about/articles/" class="menu-link sub-menu-link">Articles</a></li>
<li id="nav-menu-item-147" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/about/contact-us/" class="menu-link sub-menu-link">Contact us</a></li>
<li id="nav-menu-item-145" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/about/appointment-calendar/" class="menu-link sub-menu-link">Appointment Calendar</a></li>
</ul>
</li>
<li id="nav-menu-item-150" class="main-menu-item menu-item-depth-0 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/windows/" class="menu-link main-menu-link">Windows</a>
<ul class="sub-menu menu-odd menu-depth-1">
<div id="special"><img src="images/Untitled-3.png" /></div>
<div id="contact"> <img src="images/Untitled-4.png" /></div>
<li id="nav-menu-item-151" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/windows/double-hung/" class="menu-link sub-menu-link">Double Hung</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-152" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/double-hung/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-153" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/double-hung/glass/" class="menu-link sub-menu-link">Glass</a></li>
<li id="nav-menu-item-154" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/double-hung/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-155" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/double-hung/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-156" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/double-hung/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-157" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/windows/gliding/" class="menu-link sub-menu-link">Gliding</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-158" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/gliding/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-159" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/gliding/glass/" class="menu-link sub-menu-link">Glass</a></li>
<li id="nav-menu-item-160" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/gliding/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-161" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/gliding/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-162" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/gliding/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-163" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/windows/casement/" class="menu-link sub-menu-link">Casement</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-164" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/casement/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-165" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/casement/glass/" class="menu-link sub-menu-link">Glass</a></li>
<li id="nav-menu-item-166" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/casement/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-167" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/casement/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-168" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/casement/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-169" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/windows/awning/" class="menu-link sub-menu-link">Awning</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-170" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/awning/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-171" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/awning/glass/" class="menu-link sub-menu-link">Glass</a></li>
<li id="nav-menu-item-172" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/awning/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-173" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/awning/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-174" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/awning/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-175" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/baybow/" class="menu-link sub-menu-link">Bay/bow</a></li>
<li id="nav-menu-item-176" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/windows/specialty/" class="menu-link sub-menu-link">Specialty</a></li>
</ul>
</li>
<li id="nav-menu-item-66" class="main-menu-item menu-item-depth-0 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/doors/" class="menu-link main-menu-link">Doors</a>
<ul class="sub-menu menu-odd menu-depth-1">
<div id="special"><img src="images/Untitled-3.png" /></div>
<div id="contact"> <img src="images/Untitled-4.png" /></div>
<li id="nav-menu-item-177" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/doors/narroline-gliding/" class="menu-link sub-menu-link">Narroline gliding</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-178" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/narroline-gliding/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-179" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/narroline-gliding/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-180" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/narroline-gliding/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-181" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/narroline-gliding/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-188" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/doors/frenchwood-hinged/" class="menu-link sub-menu-link">Frenchwood hinged</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-196" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-hinged/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-195" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-hinged/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-194" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-hinged/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-193" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-hinged/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-187" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/doors/frenchwood-gliding/" class="menu-link sub-menu-link">Frenchwood gliding</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-192" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-gliding/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-191" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-gliding/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-190" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-gliding/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-189" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/frenchwood-gliding/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
<li id="nav-menu-item-186" class="sub-menu-item menu-item-depth-1 menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children"><a href="http://www.renewmywindows.com/doors/perma-shield-gliding/" class="menu-link sub-menu-link">Perma Shield Gliding</a>
<ul class="sub-menu menu-even sub-sub-menu menu-depth-2">
<li id="nav-menu-item-183" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/perma-shield-gliding/colors/" class="menu-link sub-menu-link">Colors</a></li>
<li id="nav-menu-item-182" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/perma-shield-gliding/grilles/" class="menu-link sub-menu-link">Grilles</a></li>
<li id="nav-menu-item-185" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/perma-shield-gliding/hardware/" class="menu-link sub-menu-link">Hardware</a></li>
<li id="nav-menu-item-184" class="sub-menu-item sub-sub-menu-item menu-item-depth-2 menu-item menu-item-type-post_type menu-item-object-page"><a href="http://www.renewmywindows.com/doors/perma-shield-gliding/screens/" class="menu-link sub-menu-link">Screens</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</ul>
</div>
CSS：
@charset "utf-8";
/* CSS Document */
/*depth 0*/
#mid-nav ul {
text-align: center;
padding-bottom: 0px;
padding-top: 5px;
padding-left: 0;
margin-top: 0;
/* cancels gap caused by top padding in Opera 7.54 */
margin-left: 0;
color: white;
width: 100%;
font-size: 18px;
font-weight: normal;
color: #000;
line-height: 18px;/* fixes Firefox 0.9.3 */
}
#mid-nav ul li {
display: inline;
padding-left: 0;
padding-right: 0;
padding-bottom: 5px;
/* matches link padding except for left and right */
padding-top: 5px;
}
#mid-nav ul li a {
padding-left: 10px;
padding-right: 10px;
padding-bottom: 5px;
padding-top: 5px;
color: white;
text-decoration: none;
border-right: 1px solid #fff;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-size: 16px;
font-weight: normal;
color: #000;
border: none;
}
#mid-nav li:hover a {/*this keeps top menu items colors whilst down in the lower ul */
background-color: #cfcfcf;
/*color: white;*/
}
#mid-nav .active {
border-left: 1px solid #fff;
}
/*depth 1*/
#special {
width: 200px;
background-color: #fff;
height: 220px;
float: left;
margin: 10px;/*padding-top:-40px;*/
}
#contact {
padding-top: 0px;
width: 200px;
background-color: #fff;
height: 220px;
float: right;
margin: 10px;/*padding-top:-40px!important; */
}
#mid-nav ul li ul {
display: none;
}
#mid-nav ul li ul li {
display:inline;
float:left;
width: 200px;
margin-right:100px;
}
#mid-nav ul li ul a{
width:1400px;
background-color:transparent!important;
/*#mid-nav ul li ul a {*/
color:#000;
padding-left: 10px;
text-align: left!important;
padding-right: 10px;
padding-bottom: 5px;
padding-top: 5px;
text-decoration: none;
border-right: 1px solid #fff;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-size: 14px;
font-weight: normal;
border: none;
}
#mid-nav ul li:hover > ul {
position: absolute;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
top: 40px;
width: 800px;
height: 250px;
/*background-color: #cfcfcf;*/
display: inline;
text-align: left;
}
#mid-nav li li:hover a {/*this keeps level 1 menu items colors whilst down in the lower ul */
background-color: #cfcfcf!important;
}
#mid-nav ul li ul li:hover {
background-color: #cfcfcf!important;
}
/*depth 2*/
#mid-nav ul li ul li ul{
}
#mid-nav ul li ul li:hover > ul {
position: absolute;
margin-left: auto;
margin-right: auto;
left: 175px;
right: 0;
top: 0px;
width: 150px;
height: 245px;
background-color: #cfcfcf;/*!important;*/
display: inline;
text-align: left;
padding-top: 10px;
}
#mid-nav ul li ul li ul li {
background-color:transparent/*!important*/;
width:150px;
}
#mid-nav ul li ul li ul li a {
background-color:transparent/*!important*/;
font-size: 12px;
}
#mid-nav ul li ul li ul li:hover {
background-color:#b4b4b4!important;
color:#fff;
}
#mid-nav ul li ul li ul li:hover > a{
background-color:#b4b4b4!important;
color:#fff;
}
.menu-depth-1{
background: #cfcfcf; /* Old browsers SHADOW AND GRADIENT */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjY2ZjZmNmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZTJlMmUyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2NmY2ZjZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(45deg, #cfcfcf 0%, #e2e2e2 50%, #cfcfcf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #cfcfcf), color-stop(50%, #e2e2e2), color-stop(100%, #cfcfcf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(45deg, #cfcfcf 0%, #e2e2e2 50%, #cfcfcf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(45deg, #cfcfcf 0%, #e2e2e2 50%, #cfcfcf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(45deg, #cfcfcf 0%, #e2e2e2 50%, #cfcfcf 100%); /* IE10+ */
background: linear-gradient(45deg, #cfcfcf 0%, #e2e2e2 50%, #cfcfcf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfcfcf', endColorstr='#cfcfcf', GradientType=1 ); /* IE6-8 fallback on horizontal gradient */
-webkit-box-shadow: 8px 8px 15px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 8px 8px 15px 0px rgba(0,0,0,0.75);
box-shadow: 8px 8px 15px 0px rgba(0,0,0,0.75);
}
和我的借口jQuery的史诗失败：
<script type="text/javascript">
$(document).ready(function () {
// $("#nav-menu-item-68").hover(function(){
// console.log($(this));
// $("#testtt").slideDown( 10000,function(){
// alert("The slideDown() method is finished!"); });
// console.log($(this).children('ul'));
// },function(){
// $(this).find('ul').slideUp( "fast" );
//
// });
//cache nav
var nav = $("#mid-nav");
//add indicator and hovers to submenu parents
nav.find("li").each(function () {
if ($(this).find("ul").length > 0) {
$("<span>").text("^").appendTo($(this).children(":first"));
//show subnav on hover
$("#nav-menu-item-68").mouseenter(function () {
$("#testtt").stop(true, true).slideDown();
});
//hide submenus on exit
$(this).mouseleave(function () {
$("testtt").stop(true, true).slideUp();
});
}
});
});
</script>
我开始认为问题可能在于我的CSS（以及我的JS）
任何向正确方向推进都会有所帮助（此时我的JS无用）
编辑：
我忘记提及我尝试过的所有事情以及他们所拥有的结果......
$(".topmenu").children('li').hover(function(){
$(this).slideDown();
});
这是我的第一次尝试，它什么也没做。我已经使用了控制台日志记录来确保在其他尝试中我选择了正确的类/ id
然后我接下来的事情与上面类似，但它只会滑动文本，而不是整个包含UL。
现在已经试图解决这个问题太久了！ AHHHHH！
由于
C