用jQuery在第一次點擊的網站上彈出頁腳？

Question

我有問題用jQuery彈出頁腳。我的代碼是工作，但唯一的問題是它不起作用的第一次點擊按鈕，它通過第二次單擊按鈕工作？任何想法？ 這裏是我的代碼：

<script type="text/javascript"> 

    jQuery(function($) { 

     var open = false; 

     $('#footerSlideButton').click(function() { 

      if(open === false) { 

       $('#footerSlideContainer').animate({ height: '0' }); 

       $(this).css('backgroundPosition', 'top left'); 

       open = true; 

      } else { 

       $('#footerSlideContainer').animate({ height: '150px' }); 

       $(this).css('backgroundPosition', 'bottom left'); 

       open = false; 

      } 

     });   

    }); 

</script> 

Answer 1

我會濃縮成這樣：

(function($){ 
    window.opened=false; 
    $('#footerSlideButton').on('click', function() { 
     $('#footerSlideContainer').animate({ height : opened ? '0' : '150px'}); 
     $(this).css('backgroundPosition', opened ? 'top left' : 'bottom left'); 
     opened = !opened; 
    }); 
})(jQuery); 

你也可以存儲在元數據開放狀態：

(function($){ 
    $('#footerSlideButton').on('click', function() { 
     $('#footerSlideContainer').animate({ height : $(this).data('open') ? '0' : '150px'}); 
     $(this).css('backgroundPosition', $(this).data('open') ? 'top left' : 'bottom left'); 
     $(this).data('open', !$(this).data('open')); 
    }); 
})(jQuery);