0

我不明白为什么一个特定的 div (id=error) 不会为这里的 div 设置动画：

<asp:Content ID="SContent" ContentPlaceHolderID="MainMessageContent" runat="server">
    <div class="ui-widget" id="widget">
            <div id="error" runat="server" visible="false" style="padding: 0 .7em; margin-bottom:5px;">
                <p><span id="msgSpan" runat="server" style="float: left; margin-right: .3em;"></span>
                <strong>
                    <asp:Label ID="lblMessage" runat="server"></asp:Label>
                </strong></p>
            </div>
        </div>
</asp:Content>

这是jquery：

$("#MainMessageContent_error").animate({
        backgroundColor: "#FFB24B"
    },
                3000,
                function () {
                    $("#MainMessageContent_error").animate({ backgroundColor: "#fff" }, 3000);
                    $('#MainMessageContent_error').delay(10000).fadeOut('slow', function () {
                    });
                }
     );

它淡出，但没有动画。

4

2 回答 2

1

为了使用动画效果，您需要插件jquery-ui库。在核心 jquery 库中没有这样的方法。

于 2012-05-02T12:57:34.923 回答
1

您可能想尝试的现代解决方案是：

<style type="text/css">
#MainMessageContent_error {
    -webkit-transition: background-color 3s;
    -moz-transition: background-color 3s;
    transition: background-color 3s;

    background-color: #FFB24B;
}

#MainMessageContent_error.animate {
    background-color: #FFF;
}
</style>

并做一个.addClass('animate');。

如果你想回去，简单.removeClass('animate');的。

这提供了一个流畅的动画，不那么滞后。在有人说“IE 版本怎么样？”之前 请注意，此解决方案仍然有效，但没有动画。

于 2012-05-02T12:47:50.040 回答