按下輔助按鈕時關閉按鈕上的活動狀態

Question

我在關閉頁腳按鈕上的活動狀態時遇到問題。當您點擊頁腳它會滑動一個隱藏的div推動修復div，並更改單詞頁腳關閉，背景顏色爲其活動狀態。一旦你點擊關閉div將滑下來，措辭將變回頁腳，隱藏活動狀態。

問題

當我點擊菜單按鈕，它不會改變在頁腳按鈕激活狀態。 div將滑落，但措辭不會從靠近頁腳改變，並且背景顏色不會改變。

的JS

$('#more').click(function() { 
    var open = $('header').is('.open'); 
    $('#footerPanel')['slide' + (open ? 'Up' : 'Down')](400); 
    $('header').animate({ 
     bottom: (open ? '-' : '+') + '=120' 
    }, 400, function() { 
     $('header').toggleClass('open'); 
    });     
}); 
$('#menu').click(function() { 
    if ($('header').is('.open')) { 
     $('header').removeClass('open').animate({'bottom': "-=120"}); 
     $('#footerPanel').slideUp(400); 
    } 
}); 
$('.footerButton').click(function(){ 
    var $this = $(this); 
    $this.toggleClass('footerButton'); 
    if($this.hasClass('footerButton')){ 
     $this.text('Footer');   
    } 
    else 
    { 
     $this.text('Close'); 
    } 
    $(this).toggleClass('activetoggle'); 
}); 

我Fiddle。 我該如何解決這個問題？

Answer 1

當點擊菜單按鈕時，我添加了以下函數作爲animate函數的回調函數。它將檢查腳註按鈕是否處於活動狀態，如果是，則會相應地更新，否則它將保持不變。

function() { 
    var $footer = $('.activetoggle'); 

    if ($footer.length) 
     $footer 
      .toggleClass('activetoggle footerButton') 
      .text('Footer'); 
} 

Updated Fiddle