在InternetExplorer9中使用jQuery为子对象设置动画时，父div会删除阴影错误

当父div应用了css下拉阴影，并且其子div使用jQuery设置动画以便父div更改高度时，在IE9中查看页面时，父div下方会出现奇怪的线条。下面是一个示例：和一个屏幕截图：

对于那些只想看到代码的人；以下是HTML：

<div class="parent">
    <div class="longer">&nbsp;</div>
</div>

以及JavaScript（注意，第一个需要jQuery UI）：

我的问题是,

这是jQuery还是Internet Explorer的bug

你能找到绕过它的办法吗？（Internet Explorer 9不支持转换，因此我一无所知）

---

非常感谢您的帮助。

您的代码有点复杂。我不能确切地说出你想要的行为是什么，但这看起来更流畅，我觉得IE9可以更好地处理它，但我无法测试

$("a.toggleclass").click(function() {
    $('.parent').animate({height: 1000}, '1000');
});

我更新了你的密码。我觉得这与

有关。stop（true，true）

类似，我相信我提出的答案是中肯的

简言之：

---

完整解释：

我的代码除了指向IE9中的一个bug之外，没有做任何事情：当你降低孩子的高度时，会出现一些线条。这在我的“js小提琴”示例中很明显。如果需要更多信息，可以添加注释。我很感激你的努力，但这个答案与这个问题无关，因为你甚至没有降低身高。请不要仅仅为了回答问题而回答问题，因为这样做会降低得到正确答案的机会。谢谢。我在这里问了类似的问题，很好奇你是否找到了解决办法

$("a.toggleclass").on("click", function() { //some trigger, doesn't matter where
    div.stop(true,true).toggleClass("longer", 1000);
});

$("a.animate").on("click", function() { //another one without jQuery UI
    div.stop(true,true).animate({"height":"20px"}, function() {
        div.attr({"style":""});
    });
});

$("a.toggleclass").click(function() {
    $('.parent').animate({height: 1000}, '1000');
});