3

私はレスポンシブサイトに取り組んでいます。いわばjQueryの「メディアクエリ」の変更を処理する方法を探しています。

一部の要素の高さ、幅などの計算を取得しましたが、1160px から 980px など、メディア クエリが変更されたときにそれらを再計算する必要があります。

setTimeout()ほとんどのブラウザでサポートされているはずなので（すべてではないにしても）、良いと思われるソリューションを見つけましたが、これと同じくらい頻繁に実行することでパフォーマンスやその他の問題があるかどうかはわかりません。

ライブ例のjsfiddle

setInterval(function() {
    //code here
}, 100);​

paulirish または他のクルーによって既に作成されたプラグインを使用する他のより良い方法があるでしょうか? この問題についてのあなたの経験を私にアドバイスしてください。

4

1 に答える 1

0

このコードを使用して、jquery の「メディア クエリ」を処理しています。メディア クエリのサイズ (480、980、1160) を取得した要素をセレクターとして使用しました。通常はラッパー、または私の場合はヘッダーのようなものです。

var myDivWidth = $('YOUR-SELECTOR').width();
$(window).resize(function () {

    if ($('YOUR-SELECTOR').width() != myDivWidth) {

        //If the media query has been triggered
                myDivWidth = $('YOUR-SELECTOR').width();

        //Your resize logic here                
         }
});
于 2012-07-20T09:02:06.253 に答える