jQuery Animate - 不会为绝对DIV制作动画

mal*_*200 9 jquery animation css-position

你知道为什么我不能用jQuery动画绝对定位div吗?

请在这里显示(这是我的例子):

http://jsfiddle.net/2VJe8/

HTML:

<html>
<body>
    <div class="test">
        <div class="box">
            <div class="arrow"></div> 
        </div>
        <a href="#" class="btnStartAni">Animate</a>
    </div>
</body>
Run Code Online (Sandbox Code Playgroud)

CSS:

.test { margin: 0; padding: 0;}
.test .box { width: 150px; height: 140px; background-color: red; position: relative; }
.test .box .arrow { width: 50px; height: 50px; background-color: black; position: 
absolute; bottom: 0; right: -50px;}?
Run Code Online (Sandbox Code Playgroud)

JavaScript的:

jQuery(".test a.btnStartAni").on("click", function(e){
   e.preventDefault();
  jQuery(".box").animate({ width: 400}, 800);
});
Run Code Online (Sandbox Code Playgroud)

黑盒子是在动画隐藏期间!但我不知道为什么?

你能帮我吗?

ext*_*ter 11

jQuery会在您使用时隐藏溢出.animate,因此请将代码更改为

jQuery(".test a.btnStartAni").on("click", function(e){
    e.preventDefault();
    jQuery(".box").animate({ width: 400}, 800).css('overflow', 'visible');
});
?
Run Code Online (Sandbox Code Playgroud)

它应该工作

JsFiddle:http://jsfiddle.net/2VJe8/1/

来源:jQuery .animate()强制样式"溢出:隐藏"