Javascript在Firefox / IE中不起作用，但在Chrome中有效

Question

出於某種原因，我的導航折疊功能在Firefox / IE中不起作用，但在Chrome中有效。

<script type="text/javascript">
    $(function(){
        $('#header').data('size','big');
    });

    $(window).scroll(function(){
        var $nav = $('#header');
        if ($('body').scrollTop() > 0) {
            if ($nav.data('size') == 'big') {
                $('#logo').fadeOut(300);
                $nav.data('size','small').stop().animate({
                    height:'95px'
                }, 600);
            }
        } else {
            if ($nav.data('size') == 'small') {
                $('#logo').fadeIn(300);
                $nav.data('size','big').stop().animate({
                    height:'185px'
                }, 600);
            }  
        }
    });
</script>

有任何想法嗎？ 我認為這是一個語法錯誤。

您可以在http://medialimes.com的導航中查看實時示例

Answer 1

嘗試使用$(window).scrollTop()而不是$('body').scrollTop() 。 這應該適用於Chrome和Firefox / IE。

Answer 2

我的猜測是，當你嘗試設置

$('#header').data('size','big') 

實際上並沒有正確設置數據變量。

嘗試使用attr方法設置它。

$(#header).attr('size','big');