Jquery对话框效果,停止动画队列

时间:2011-01-30 14:31:33

标签: jquery dialog slide

我在悬停和鼠标输出上添加了幻灯片功能,我关闭了对话框(幻灯片)。如果我反复继续悬停并移动鼠标指针,则幻灯片的工作速度非常慢,对话框会一直滑动。任何想法如何防止??

此外,如果我在下面的代码中添加“Modal:True”。整件事情甚至无法奏效。任何解决方案??

<script type="text/javascript">
    $(document).ready(function() {


        $('.image').each(function() {
            var panel = $(this).siblings('.descPanel');
            $(this).mouseover(function() {
                panel.dialog('open');
            });

            $(this).mouseout(function() {
                panel.dialog('close');
            });
        });

        $(".descPanel").dialog({ autoOpen: false,show:slide,hide:slide,
            open: function() {
                $(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar").addClass("ui-state-error");
            }
        });

</script>

HTML Strcuture:

<form id="form1" runat="server">
<div>
    <table>
        <tr id="tr">
            <td></td>
            <td></td>
            <td>
                <asp:Image runat="server" ImageUrl="~/Jquery/Untitled.jpg" CssClass="image" />
                <asp:Panel runat="server" ID="mypanel" CssClass="descPanel">
                    <asp:Label runat="server" ID="mylabel" CssClass="label" Text="hello"></asp:Label>
                </asp:Panel>
            </td>
        </tr>
    </table>
    <table>
        <tr id="tr">
            <td></td>
            <td></td>
            <td>
                <asp:Image ID="Image1" runat="server" ImageUrl="~/Jquery/Untitled.jpg" CssClass="image" />
                <asp:Panel runat="server" ID="Panel1" CssClass="descPanel">
                    <asp:Label runat="server" ID="Label1" CssClass="label" Text="hello1111"></asp:Label>
                </asp:Panel>
            </td>
        </tr>
    </table>
</div>
</form>

谢谢, KUNAL

1 个答案:

答案 0 :(得分:0)

您可以将close更改为destroy

 $(this).mouseout(function() {
    panel.dialog('destroy');
 });