0

我正在尝试根据以下与媒体查询相关的情况向 jquery 添加不同的值。

HTML

<div id="content">
</div>

JS

$("html,body").animate({scrollTop: 360}, 1000);

期望的效果,类似于此

@media handheld, only screen and (max-width: 1024px) {

$("html,body").animate({scrollTop: 660}, 1000);

}

@media handheld, only screen and (max-width: 768px) {

$("html,body").animate({scrollTop: 260}, 1000);

}

最理想的方法是什么?

4

1 回答 1

1

正如评论者所说,您不能像那样同时使用 JS 和 CSS。你可以这样做:

var width = $(window).width(), scroll = 360;

if(width <= 1024){
    scroll = width > 768 ? 660 : 260;
    // if (width > 768) means width must be 769-1024 so scroll = 660.
    // else the width must be 768 or below so scroll = 260 
}

$("html, body").animate({scrollTop: scroll}, 1000);
于 2013-05-23T18:35:51.423 回答