jQuery的孩子沒有動畫

Question

我想動畫一個div的只有特定的孩子，但如果我指定的類沒有什麼是動畫。如果我指定父類，那很好。

檢查出的jsfiddle：http://jsfiddle.net/7y5he/19/

HTML：

<button id="left">Left</button> 
<button id="right">Right</button> 
<div class="target"> 
    <div id="targetDiv1" class="targetchild_no_animate" style="overflow:auto;height:20px;">AAA</div> 
    <div id="targetDiv2" class="targetchild" style="overflow:auto;height:20px;">111</div> 
    <div id="targetDiv3" class="targetchild" style="overflow:auto;height:20px;">22222</div> 
    <div id="targetDiv4" class="targetchild" style="overflow:auto;height:20px;">33333</div> 
    </div> 
    <div class="tarWidth" style="top:100px;position:relative"></div> 

var rightCards = 0; 
var leftCards = 0; 

$("#left").click(function() { 
    leftCards = '-' + $(".targetchild").width() + 'px'; 
    $(".targetchild").stop().animate({ 
    'left': leftCards 
    }); 
    $('.tarWidth').text($(".targetchild").width() + 'px'); 
}); 

    // Start animation in the opposite direction 
$("#right").click(function() { 
    rightCards = '+' + $(".targetchild").width() + 'px'; 
    $(".targetchild").stop().animate({ 
    'left': rightCards 
    }); 
    $('.tarWidth').text($(".targetchild").width() + 'px'); 
}); 

Answer 1

你需要爲孩子的位置，否則它是static：

DEMO jsFiddle

div.targetchild { 
    position:relative; 
}