私たちのウェブサイトにスライドショーjqueryプラグインがあります。私は自分のウェブサイトをレスポンシブにすることに取り組んでいます。モバイル解像度でスライドショーを表示したくありません。ただし、を使用して非表示にすることはできますがdisplay:none
、モバイルデバイスに余分な情報のダウンロードが発生します。
スライドショー画像が携帯電話に読み込まれないようにする方法はありますか?
私たちのウェブサイトにスライドショーjqueryプラグインがあります。私は自分のウェブサイトをレスポンシブにすることに取り組んでいます。モバイル解像度でスライドショーを表示したくありません。ただし、を使用して非表示にすることはできますがdisplay:none
、モバイルデバイスに余分な情報のダウンロードが発生します。
スライドショー画像が携帯電話に読み込まれないようにする方法はありますか?
これは、メディアクエリを使用して実行でき、背景画像を含めることができます
たとえば、画像を含める場合
@media (min-width: 768px) and (max-width: 979px) {
// css here only applied when min-width: 768px and max-width: 979px
}
JavaScript を使用するとどうなりますか?
いつものように jQuery スライドショー プラグインをインクルードしますが、(とにかく) 自動起動しないようにします。if
次に、オブジェクトをチェックwindow
して現在のビューポート (ユーザー) の寸法を確認する単純な を記述します。そして、彼らがそれを「モバイル範囲」と呼べるようになった場合(メディアクエリのように)、スライドショーを開始しないでください。
スライドショー プラグインが正しく記述されている場合、スライドショーの手動の非自動開始をサポートする必要があり、スライドショーが実際に開始されるまで画像を要求しない (したがって、帯域幅を制限する) べきではありません。これらがサポートされていない場合は、プラグインの変更を検討してください。そのようなプラグインは、数千とは言わないまでも数百あります。