Jquery - 無法獲得嵌套div選擇器動畫？

我已經嘗試過幾種幾何變體，但無法獲得嵌套div的正確選擇器。我需要爲這個div製作動畫，並且由於沒有動畫正在發生，所以我只剩下來結束我沒有抓住正確的選擇器。Jquery - 無法獲得嵌套div選擇器動畫？

這裏是我的動畫：

$(".lab1").hover(function(){ 
    $(".panel-group .panel", this).stop(true, false).animate({ marginTop: "-80px;"}); //Trying to get this 
    $(".panel", this).stop(true, false).animate({ height: "140px"}); 

}, function() { 
    $("div.panel.panel-default", this).stop(true, false).animate({ marginTop: "0px;"}); 
    $(".panel", this).stop(true, false).animate({ height: "98px" }); 
});

與marginTop第二行是一個沒有發生。我已經去了鉻，並試圖在那裏使用選擇器，但沒有任何工作。這是我的html：

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true" style = "text-align: left;margin-top: 30px;"> 
<div class="lab1"> <!--CTedit --> 
    <div class="panel panel-default"> 
    <div class="panel-heading" role="tab" id="headingOne"> 
     <h4 class="panel-title"> 
     <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"><i class="fa fa-plus-square-o"></i><span style="margin-left: 12px; display: inline-block;"></span>Lab Focus: Cloud Management with vRealize Operations & <nobr>vRealize Automation</nobr></a> 
     </h4> 
    </div>

我想獲得第二面板默認。我怎樣才能得到選擇器？

來源

2016-08-20 skyguy

嘗試使用'$（本）.find（「面板」。）停止....' –

沒有工作 - 我有許多東西在那裏與.panel如此表示。可能是問題。試圖找到.panel默認，但沒有工作 – skyguy

.panel-group不是.lab1

來源

2016-08-20 16:29:49 guest271314

不，我知道我正在嘗試別的 - 我試過.panel默認.panel.panel默認，div.panel.panel默認 – skyguy

_「我想獲得第二個面板默認「_只有一個'.panel-default'元素出現在'html'問題？你可以創建一個jsfiddle http://jsfiddle.net來演示嗎？ – guest271314

動畫正在發生的事情，但動畫低於你的代碼回採它的子元素。檢查這jsfiddle。你也有一些錯誤。 marginTop: "-80px;"最後不需要;marginTop: "-80px" 這行代碼會停止動畫，這就是爲什麼你不能得到它。

$(".panel", this).stop(true, false).animate({ height: "140px"});

來源

2016-08-20 16:49:51

當您在元素上調用兩次stop()函數時，第二次調用會在第一次動畫開始之前結束。另外，請勿將;放入您的字符串中，並分別爲this設置動畫。此代碼的工作：

$(".lab1").hover(function() { 
    $(".panel-group .panel").stop(true, false).animate({ marginTop: "-80px"}); //Trying to get this 
    $(".panel").animate({ height: "140px"}); 
    $(this).stop(true, false).animate({marginTop: "-80px", height: "140px"}); 

}, function() { 
    $(".panel-group .panel").stop(true, false).animate({ marginTop: "0px"}); 
    $(".panel").animate({ height: "98px" }); 
    $(this).stop(true, false).animate({marginTop: "0px", height: "98px"}); 
});

來源

2016-08-20 17:17:23 Hulothe

Jquery - 無法獲得嵌套div選擇器動畫？

回答

相關問題