两个按钮为底部抽屉设置动画？

Question

我希望有人可以帮助我弄清楚如何创建两个执行相同操作的按钮。目前，我有一个底部抽屉，上面有一个可见的、可点击的标签来打开。我想创建一个执行相同操作的附加按钮，但我不太确定如何编写 JQuery 函数。

我当前用于底部抽屉的 JQuery 如下。如果它提供更多上下文，我还链接到小提琴。 My Fiddle

var h_bt = 0; //variable to keep track of the div#bottom condition.

    $('a#handler_bottom').on('click', function(event){  

        event.preventDefault();

        if(h_bt == 0){

            //$('div#bottom').animate({top:'600px'}, 300);
            //$('div#top').css({'background-color': 'red'});

            $(this).parent().animate({top:'480px'}, 300);
            $(this).css({'background-color': '#838da6'});

            h_bt = 1;
        }else{

            $(this).parent().animate({top:'600px'}, 300);
            $(this).css({'background-color': '#838da6'});

            h_bt = 0;
        }
    });

感谢您的帮助！

Answer 1

创建一个函数并将其附加到两个事件：-

function repeatFunction(event){
 event.preventDefault();

    if(h_bt == 0){

        //$('div#bottom').animate({top:'600px'}, 300);
        //$('div#top').css({'background-color': 'red'});

        $(this).parent().animate({top:'480px'}, 300);
        $(this).css({'background-color': '#838da6'});

        h_bt = 1;
    }else{

        $(this).parent().animate({top:'600px'}, 300);
        $(this).css({'background-color': '#838da6'});

        h_bt = 0;
    }  

}

1. 将它应用于两个事件，例如：-

   $(函数(){ $(element1).click(函数(事件){ 重复函数（事件）； });

   $(element2).click(函数(事件){ 重复函数（事件）； }); });