2014-01-10 73 views
0

所以我有容器,裏面有5個div的yui庫。這個div是菜單。所以我想要做的是,當我將鼠標移到div上時,只有這個動畫會向上移動,而當我將鼠標移動到其他位置時,它將動畫向下。我的js代碼同時對所有元素進行動畫處理。jQuery「動畫」多個div inisde div

<div class="container"> 
<div class='yui3-g-r'> 

    <div class="yui3-u-1-5"> 
     <div class="kvadrat"> 
      <span class="title"><a>Smeri</a></span><br/> 
      <span class="description"> 
       <ul class="blabla"> 
       <li><a class="link" href="smeri/racunalnistvo_prva/index.html" >Računalništvo</a></li> 
       <li><a class="link">Strojništvo</a></li> 
       </ul> 
      </span> 
     </div> 
    </div> 

    <div class="yui3-u-1-5"> 
     <div class="kvadrat"> 
      <span class="title"><a>Galerija</a></span><br/> 
      <span class="description"> 
       <ul class="blabla"> 
        <li><a class="link" href="galerija/predstavitev poklicev-nak. center/osnova/index.html">Slike</a></li> 
       </ul> 
      </span> 
     </div> 
    </div> 

我的jQuery代碼是這樣的:

$(".description").hide(); 

$('div.kvadrat').hover(
    function() { 
     $(".description").slideDown("slow"); 
    }, 
    function() { 
     $(".description").slideUp("slow"); 
    } 
); 

回答

0
$(".description").hide(); 

$('div.kvadrat').hover(
    function() { 
     $(this).find(".description").slideDown("slow"); 
    }, 
    function() { 
     $(this).find(".description").slideUp("slow"); 
    } 
);