1

小さなデバイスでのみ起動したい単純な JavaScript (イベントに埋め込まれている) があります。電話など...

現在、私はやっています

if ($(window).width() < 606) {
  do_things();
}

でもこれはダサい気がする。特定のブレークポイントよりも小さいデバイスに対してのみこれを実行する方法はありますか (以前の変数を設定するだけではありません)。理想的には、CSS ブレークポイントで動作するものです。

私は Bootstrap を使用しているので、それを利用した簡単なオプションがあるかもしれません。

4

1 に答える 1

4

コードが粗雑に見えるかもしれませんが、これは実際にはメディア クエリとは何かを簡単に表したものです。Respond.js (古いブラウザーにメディア クエリ サポートを追加する JS ライブラリ)のソースを見ると、次の関数が含まれています。

function getDeviceWidth() {
    if (typeof (window.innerWidth) == 'number') {
        //Non-IE
        return window.innerWidth;
    } else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
        //IE 6+ in 'standards compliant mode'
        return document.documentElement.clientWidth;
    } else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        //IE 4 compatible
        return document.body.clientWidth;
    }
    return 0;
}

onResizeこれは、デバイスの幅を検出するためのより完全なアプローチですが (これは、回転などを検出するイベント ハンドラーと組み合わされています)、基本的にはユーザーが行っていることです。

于 2013-08-14T16:51:03.580 に答える