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 に答える