分別爲每個選擇器設置動畫效果

我有幾個DIV存在圖像。在這些圖像的背後，會出現一些動畫標籤。分別爲每個選擇器設置動畫效果

問題是動畫效果是對所有人完成的，而不是分別爲每一個動畫。這裏是代碼。

HTML

<div class="MainGallery">     
     <div class="MainGalleryData" id="MainGalleryData"> 
      <ul> 
       <li> 
        <img src="img/pic1a.png" alt="" /> 
        <label class="MainGalleryDataSite">  
         <a href="Contact.aspx" target="_top"> </a>  
        </label>  
       </li> 
      </ul> 
     </div> 

    <div class="MainGalleryData" id="MainGalleryData2"> 
      <ul> 
       <li> 
        <img src="img/pic1a.png" alt="" /> 
        <label class="MainGalleryDataSite">  
         <a href="Contact.aspx" target="_top"> </a>  
        </label>  
       </li> 
      </ul> 
     </div>

$(document).ready(function() { 

    $(".MainGallery li").hover(function() { 

    $(".MainGallery li .MainGalleryDataSite").animate({ "top": "-178px" }, "fast"); 

    },function() { 

    $(".MainGallery li .MainGalleryDataSite").animate({ "top": "-148px" }, "fast"); 

    } 

); 

});

來源

2013-03-01 John

'$（「。MainGalleryDataSite」，this）.animate（...）' – 2013-03-01 15:56:09

感謝凱文但無效！ – John 2013-03-01 15:58:50

在這種情況下什麼不有效？根本沒有動畫？仍然動畫所有？ – 2013-03-01 16:00:31

您設置動畫的所有列表中的項目，如果你這樣稱呼它：

$(".MainGallery li .MainGalleryDataSite").animate({ "top": "-148px" }, "fast");

改變你的JavaScript這樣的：

$(document).ready(function() { 
    $(".MainGallery li").hover(function() { 
     $("this").find(".MainGalleryDataSite").animate({ "top": "-178px" }, "fast"); 
    },function() { 
     $("this").find(".MainGalleryDataSite").animate({ "top": "-148px" }, "fast"); 
    } 
);});

來源

2013-03-01 15:59:17 Dine

沒有結果我的朋友！不能用變量完成......？ [理論上只知道這些] – John 2013-03-01 16:03:13

會發生什麼？仍然是所有MainGalleryDataSite項目的動畫？如果沒有動畫，您可能需要確保MainGalleryDataSite絕對定位。 – Dine 2013-03-01 16:06:56

OH這就是我在粘貼代碼時犯的錯誤。當然他們有不同的ID :) – John 2013-03-01 16:07:28

問題出在你指的是具有適當類的所有元素，而不僅僅是具有鼠標的元素的子元素。看看你的問題的這種簡化jsfiddle，使用

$(this)

另外，還要注意兩個函數的用法：mousesenter和mouseleave代替hover它現在被認爲是過時，應避免配伍使用jQuery的版本高於1.8。

來源

2013-03-01 16:17:41

感謝您的努力。我明白了。 – John 2013-03-01 16:25:22

分別爲每個選擇器設置動畫效果

回答

相關問題