モバイルユーザによるデスクトップカルーセルイメージのダウンロードを防止する

スタティックな背景イメージを特定の（デスクトップish）ブレークポイントでカルーセルにしたいと思います。モバイルユーザーがこれらのカルーセル画像をダウンロードしないようにすることは可能でしょうか？私が知っている限り、メディアのクエリはここでは十分ではありません。モバイルユーザによるデスクトップカルーセルイメージのダウンロードを防止する

私は自分のデバイスに保存する画像を手動でダウンロードしているわけではありません。

出典

2017-02-03 user3669771

あなたは何を試してみましたか？あなたのコードを含めてください。 – andi

私はあるブラウザの幅でカルーセルになる背景イメージを持っています。私はそれが特定の幅に達すると、カルーセル関数を実行するウィンドウサイズのイベントリスナーを持っています。私の知る限りでは、ユーザーがすべての画像をダウンロードするのを防ぐのに十分ではありません。 – user3669771

ブラウザでHTMLソースが取得されると、画像のダウンロードが停止することはありません。デフォルトでページがないようにページを修正し、AJAXでJSを使用して適切なセクションをダウンロードする必要があります。 DPIと解決策は重要であることに留意してください。 – David

Media Queriesはこの問題を完全に解決します。あなたはこのコードを使用して、ブラウザを持っている1024pxを超えるサイズで、開発者ツールを使用している場合

/* Mobile-first */ 
element { 
    background-image:url("small image here"); 
} 


/* Desktop */ 
@media screen and (min-width: 1024px) { 

    element { 
    background-image:url("large image here"); 
    } 
}

は、要素を検査しますが、画像の大きなバージョンはバックグラウンドのソースとして使用されて表示されます。ブラウザを1024より下に縮小すると、ソースが小さなバージョンに変更されます。ブラウザはイメージのソースの値だけをダウンロードするので、モバイルユーザーは大きなバージョンのダウンロードを諦めることはありません。

出典

2017-02-03 18:12:08

これを実際のカルーセルでどのように使用するかについての段落を追加するとよいでしょう。例えば。各画像に使用されたID、および何もない。 – David

@Davidどのようにカルーセルを実装するかについての質問はありませんでした（その中には無数の方法があります）。 OPはすでにそのように働いているようだ。 –

@ScottMarcus面白いです。私はこれがすべて必要だったことを理解していませんでした！ありがとう。 – user3669771

モバイルユーザによるデスクトップカルーセルイメージのダウンロードを防止する

答えて

関連する問題