確定這裏是鏈接在這裏你可以看到問題 http://porotoestudio.com/a/ana/nmd/espiritu.html
我想要做的是創造一個導航欄，所有的元素都被動畫化之後，porblem與背景， slideDivB在show_hideB後面，動畫有效，但問題是，當我試圖圍繞酒吧和元素移動時，SlidingDivB開始顯示和隱藏像瘋了似的，我需要它仍然停留和展示，而我瀏覽低谷的元素....
這個HTML代碼
<html>
<!--Comienza Botonera-->
<div id="botonera" class="escondido">
<div id="activa-botonera" class="show_hideB"></div>
<div id="fondo-botonera" class="slidingDivB"></div>
<div id="botonera_nivel1" class="typeface-js" style="font-family:GreyscaleBasic">
<a href="espiritu.html"><p>espíritu</p></a>
<p> </p>
<a href="#" class="show_hideS"><p>soluciones</p></a>
<p> </p>
<a href="#" class="show_hideP"><p>proyectos</p></a>
<p> </p>
<a href="#" class="show_hideE"><p>estructura</p></a>
<p> </p>
<a href="#"><p>con-texto</p></a>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<a href="contactos.html"><p>contactos</p></a>
</div>
<div id="botonera_proyectos" class="slidingDivP">
<div class="typeface-js" style="font-family:GreyscaleBasic">
<a href="proyectos_arq.html">proyectos arquitectónicos</a>
<p> </p>
<a href="proyectos_urb.html">planes y proyectos urbanos</a><br />
<p> </p>
<a href="arquit_pai.html">arquitectura del paisaje</a><br />
<p> </p>
<a href="arquit_int.html">arquitectura interior</a><br />
<p> </p>
<a href="arquit_trans.html">arquitectura del transporte</a><br />
</div>
<div id="proyectos_flecha"class="typeface-js" style="font-family:GreyscaleBasic">></div>
</div>
<div id="botonera_soluciones" class="slidingDivS">
<div class="typeface-js" style="font-family:GreyscaleBasic">
<a href="soluciones_arq.html">proyectos arquitectónicos</a><br />
<p> </p>
<a href="soluciones_urb.html">planes y proyectos urbanos</a><br />
<p> </p>
<a href="soluciones_pai.html">arquitectura del paisaje</a><br />
<p> </p>
<a href="soluciones_int.html">arquitectura interior</a><br />
<p> </p>
<a href="soluciones_trans.html">arquitectura del transporte</a>
<br />
</div>
<div id="soluciones_flecha" class="typeface-js" style="font-family:GreyscaleBasic">></div>
</div>
<div id="botonera_estructura" class="slidingDivE">
<div class="typeface-js" style="font-family:GreyscaleBasic">
<a href="somos-historia.html">somos/historia</a><br />
<p> </p>
<a href="mision-vision.html">misión/visión</a><br />
<p> </p>
<a href="#" class="show_hideQ">equipo</a><br />
<br />
</div>
<div id="estructura_flecha" class="typeface-js" style="font-family:GreyscaleBasic">></div>
</div>
<div id="botonera_equipo" class="slidingDivQ">
<div class="typeface-js" style="font-family:GreyscaleBasic">
<a href="gobierno.html">gobierno NMD</a><br />
<p> </p>
<a href="clientes.html">clientes</a><br />
<p> </p>
<a href="fichas.html">fichas</a><br />
<br />
</div>
<div id="equipo_flecha" class="typeface-js" style="font-family:GreyscaleBasic">></div>
</div>
</div>
<!--Termina Botonera-->
</html>
，這又是沃勒導航欄的腳本
<script type="text/javascript">
$(document).ready(function(){
$(".slidingDivP").hide();
$(".show_hideP").show();
$('.show_hideP').mouseover(function(){
$(".slidingDivP").slideToggle();
$(".slidingDivS").hide();
$(".slidingDivE").hide();
$(".slidingDivQ").hide();
});
});
$(document).ready(function(){
$(".slidingDivS").hide();
$(".show_hideS").show();
$('.show_hideS').mouseover(function(){
$(".slidingDivS").slideToggle();
$(".slidingDivP").hide();
$(".slidingDivE").hide();
$(".slidingDivQ").hide();
});
});
$(document).ready(function(){
$(".slidingDivE").hide();
$(".show_hideE").show();
$('.show_hideE').mouseover(function(){
$(".slidingDivE").slideToggle();
$(".slidingDivP").hide();
$(".slidingDivS").hide();
$(".slidingDivQ").hide();
});
});
$(document).ready(function(){
$(".slidingDivQ").hide();
$(".show_hideQ").show();
$('.show_hideQ').mouseover(function(){
$(".slidingDivQ").slideToggle();
$(".slidingDivP").hide();
$(".slidingDivS").hide();
});
});
$(document).ready(function(){
$(".slidingDivB").hide();
$(".show_hideB").show();
$('.show_hideB').mouseenter(function(){
$(".slidingDivB").slideDown();
});
$('.show_hideB').mouseleave(function(){
$(".slidingDivB").slideUp();
});
</script>
你可以做的jsfiddle？ – Aktee