javascript - 最初のクリックでウェブサイトのjqueryでフッターをポップアップしますか?

Question

jquery でフッターをポップアップする際に問題があります。私のコードは機能していますが、唯一の問題は、ボタンを最初にクリックしても機能せず、ボタンを2回クリックしても機能することですか? 何か案が？これが私のコードです：

<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);