0

サイズ変更時にウィンドウの高さを確認し、特定の高さ内にある場合は要素をアニメーション化しています。ただし、関数の起動は遅く、通常はブラウザー ウィンドウのサイズ変更が完了してから 4 ~ 5 秒後です。サイズ変更が完了したらすぐに起動する必要があります。サイズを変更している間はさらに良いでしょう。どんな助けでも大歓迎です。ありがとう。

コードは次のとおりです。

$(window).resize(function() {
    adjustPanel();
});

adjustPanel = function() {
    if ($(window).height() > 920) {
        $('#search-board-wrap').animate({
            height: 795,
            marginTop: 795
        });
    } else {
        $('#search-board-wrap').animate({
            height: 650,
            marginTop: 650
        });
    }
};
4

1 に答える 1

2

新しいアニメーションがトリガーされると、以前のアニメーションが実行され続けるため、サイズ変更イベントが何度もトリガーされると、アニメーション キューがいっぱいになる可能性があります。

.stop()現在のアニメーションを停止し、キューをクリアするために使用します。

$('#search-board-wrap').stop(true, true).animate(...

正直なところ、CSS メディア クエリだけを使用して、その JS をすべて削除します。

#search-board-wrap {
    height: 795px;
    width: 795px;
}

@media all and (max-height: 920px) {
    #search-board-wrap {
        height: 650px;
        width: 650px;
    }
}
于 2013-02-21T20:27:16.417 に答える