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

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

2 个答案: