如何在窗口宽度小于X时禁用Jquery函数

时间:2014-03-18 13:18:20

标签: jquery

我是新手,我无法让它发挥作用。 我不确定我做错了什么。 我在堆栈溢出时检查了有关此问题的其他一些答案,但仍无法根据屏幕宽度设置禁用滚动功能的大小调整。

当屏幕宽度小于900像素时,我希望此功能停止工作。

任何帮助将不胜感激

<script>
    $(function(){
    $('.nav').data('size','big');
    });

    $(window).scroll(function(){
    var $nav = $('.nav');
    if ($('body').scrollTop() > 0) {
        if ($nav.data('size') == 'big') {
            $nav.data('size','small').stop().animate({
                height:'40px'
            }, 600);
            $('.nav-collapse li a').css('height','40px');
        }
    } else {
        if ($nav.data('size') == 'small') {
            $nav.data('size','big').stop().animate({
                height:'80px'
            }, 600);
            $('.nav-collapse li a').css('height','80px');
        }  
        }
    });     
</script>

1 个答案:

答案 0 :(得分:0)

<script>
    var limiter = 900;

    $(function(){
        $('.nav').data('size','big');
    });

    $(window).scroll(function(){

        if ( $(window).width() > limiter ) { // here you go

            var $nav = $('.nav');
            if ($('body').scrollTop() > 0) {
                if ($nav.data('size') == 'big') {
                    $nav.data('size','small').stop().animate({
                        height:'40px'
                    }, 600);
                    $('.nav-collapse li a').css('height','40px');
                }
            } else {
                if ($nav.data('size') == 'small') {
                    $nav.data('size','big').stop().animate({
                        height:'80px'
                    }, 600);
                    $('.nav-collapse li a').css('height','80px');
                }  
            }
        }
    });     
</script>