jQuery窗口宽度条件不起作用

我在根据窗口宽度调整代码时遇到了一些麻烦。如果窗口宽度小于450，我希望它滚动到某个部分，否则另一个。我哪里错了？jQuery窗口宽度条件不起作用

$('.artist-kina').click(function(e){ 
    e.preventDefault(); 
    $('html, body').animate({ 
     if ($(window).width() < 450 { 
      scrollTop: $('#artists').offset().top - 60 
     } 
     else { 
      scrollTop: $('#artists').offset().top - 115 
     } 
    }, 500); 
    $('.artists-home').fadeOut(function() { 
     $('.kina-gallery').fadeIn('slow'); 
    }); 
});

来源

2014-09-13 J82

你已经忘记了一个括号你如果结构：'如果（$（窗口）.WIDTH（））' – 2014-09-13 13:27:14

@ Pieter I把它放进去，现在我得到了一个意外的错误（''。这里是错误：'错误在第148行第6列意外标记punc«（»，预计punc«：»' – J82 2014-09-13 13:30:41

^put 450后的parantesis如果（$（window）.width（）<450）{' – Arijoon 2014-09-13 13:33:43

括号是一个问题，但在更大的意义上的语法就是完全错误的：

$('html, body').animate({ 
    scrollTop: $("#artists").offset().top - (
     $(window).width() < 450 ? 60 : 115 
    ) 
}, 500);

你不能只删除一个if语句插入对象文本的中间。但是，您可以使用? :运算符在值之间做出选择，作为表达式的一部分。

现在请注意，与<body>的滚动位置混在一起可能会或可能不适用于所有浏览器。 Safari 用于有问题;它可能在更现代版本的浏览器中工作。

来源

2014-09-13 13:39:05 Pointy

我在想同样的事情，但是它的写法非常整齐。 +1 – Arijoon 2014-09-13 13:40:04

非常感谢。这有助于我从现在开始记住这一点。 – J82 2014-09-13 13:42:34

嵌套代码的方式有几个问题，但最大的问题是Animate调用。

这应该工作：

$('.artist-kina').click(function(e){ 
    e.preventDefault(); 
    if ($(window).width() < 450) { 
     $("html, body").animate({ 
      scrollTop: $('#artists').offset().top-60 
     }, 500); 
    } 
    else { 
     $("html, body").animate({ 
      scrollTop: $('#artists').offset().top-115 
     }, 500); 
    } 
    $('.artists-home').fadeOut('slow', function() { 
     $('.kina-gallery').fadeIn('slow'); 
    }); 
});

这里是一个工作的jsfiddle：http://jsfiddle.net/yy1v940u/5/

来源

2014-09-13 13:56:35

jQuery窗口宽度条件不起作用

回答

相关问题