如何让动画完成而不被打断?

时间:2012-04-25 14:42:09

标签: jquery

我遇到了jQuery和switchclass函数的问题。我正在使用serialscroll函数来浏览我的网站,并为此绑定了箭头键。我绑定了向下箭头键,通过在类之间设置动画来选择/取消选择元素。然而,我遇到的问题是,如果用户在按下向下箭头后快速向左或向右按​​下,则不允许动画完成并卡住。

function    mainselect()
        {

        setTimeout(function()
            {

            $(".selectstyle" ).switchClass( "selectstyle", "select", 200);
            $(".select" ).switchClass( "select", "selectstyle", 200);
            $(".maincontentshrink" ).switchClass( "maincontentshrink", "maincontent", 200);
            $(".maincontent" ).switchClass( "maincontent", "maincontentshrink", 200);
            return false;
            },
            250);

        }
$(document).keydown(function(e)                     //keyboard bind 
    {
    if( e.keyCode == 39 )                       //right (->)
        {   
        setTimeout(function()
            {
    //      $(".maincontent" ).switchClass( "maincontent", "maincontent", 200 );
            $(".maincontentshrink" ).switchClass( "maincontentshrink", "maincontent", 200 );
            $(".selectstyle" ).switchClass( "selectstyle", "select", 200 );
            $pane.trigger('next');
            return false;
            },
            200);
        }
    });


$(document).keydown(function(e)
    {   
    if( e.keyCode == 37 )                       //left (<-)
        {   
        setTimeout(function()
            {
    //      $(".maincontent" ).switchClass( "maincontent", "maincontent", 200 );
            $(".maincontentshrink" ).switchClass( "maincontentshrink", "maincontent", 200 );
            $(".selectstyle" ).switchClass( "selectstyle", "select", 200 );
            $pane.trigger('prev');
            },
            200);
    }
    }); 

$(document).keydown(function(e)
    {   
    if( e.keyCode == 40 )                       //down (\/) 
        {
        mainselect()

        }
    }); 

有没有办法禁用其他功能或取消绑定/绑定按键直到动画完成?

1 个答案:

答案 0 :(得分:1)

您可以使用队列。

请参阅jquery docs

中的示例

这些例子很清楚。