ホームページ > 記事 > ウェブフロントエンド > 質問と回答の形式を念頭に置いた、いくつかのタイトルのオプションを次に示します。 オプション 1 (問題に焦点を当てる): * スクロールバーが表示されると、Firefox でメディア クエリが中断されるのはなぜですか? オプション 2 (
CSS メディア クエリとスクロールバー
レスポンシブ Web デザインの領域では、メディア クエリはコンテンツをさまざまな画面サイズに適応させるための貴重なツールです。ただし、特定のブラウザでは、スクロールバーやメディア クエリを処理するときに問題が発生することがあります。
そのような問題の 1 つは、Firefox でスクロールバーを操作するときに発生します。提供されているフィドルで示されているように、画面サイズが 800 ピクセル未満になるとメディア クエリが期待どおりにトリガーされないという問題が発生しています。
mqGenie による問題の解決
この問題に対処するために、mqGenie JavaScript ライブラリを使用したソリューションが登場しました。このライブラリは、ビューポートの幅を計算するときにスクロールバーの幅を考慮してブラウザの CSS メディア クエリを調整します。
mqGenie をプロジェクトの
に組み込むことで、ユーザーはメディア クエリが意図した画面サイズに関係なく確実に実行されるようにすることができます。mqGenie の利点
mqGenie の採用には、次のような利点があります。
実装
mqGenie を実装するには、次からライブラリをダウンロードするだけです。公式ウェブサイト (http://stowball.github.io/mqGenie/)。ダウンロードした JavaScript ファイルを
内に含めます。プロジェクトのファイルを開き、そのドキュメントに従って呼び出します。以上が質問と回答の形式を念頭に置いた、いくつかのタイトルのオプションを次に示します。 オプション 1 (問題に焦点を当てる): * スクロールバーが表示されると、Firefox でメディア クエリが中断されるのはなぜですか? オプション 2 (の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。