2017-03-05 6 views
1

私は、PCでサイトを訪問しているときにのみビデオを表示するが、携帯電話を使用している場合は非表示にします。私はすでに、ほとんどのモバイルデバイスで動作するクエリを設定しました(すべてのモバイルデバイスで動作すると言えるでしょう)。私はiPhone 5s/6s、サムスンS4ミニでそれをチェックして、それは完璧に(Safari /インターネット/クロムを使用して)動作します。 Samsung S5で試したところ、Chromeでは動作しませんでした。したがって、問題は次のとおりです。なぜ、Chromeでクエリが機能しないのですか?多分サムスンs5スクリーンのサイズですか?あなたはサイトをチェックしたい場合はhttp://objectfilms.altervista.org/Chrome上のSamsung S5とのCssメディアクエリが動作しない

小さな画面を持つモバイルデバイス用のコードは、このです:

/* video background nascosto su Mobile phone */ 
@media only screen and (min-device-width : 200px) and (max-device-width : 720px) { 
    .video-div { 
     visibility: hide; 
     display: none; 
    } 
} 

サムスンS5のために働くことになっているコードは次のとおりです。

/* video background nascosto su Samsung S5 */ 
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) { 
    .video-div { 
     visibility: hide; 
     display: none; 
    } 
} 

どうすればよいですか?

+0

2番目のクエリで異なるサイズを使用しようとしましたが、何も機能しませんでした。 – Bobbe12

答えて

0

S5は、x 1920 1080の解像度を持ち、そしてそれらは、デバイスピクセルなので、私はあなたが

@media screen and (device-width: 1080px) and (device-height: 1920px) and (-webkit-device-pixel-ratio: 3) { ... 

のように、これらの値を照会...または定期的に使用する必要があるだろうと思いますデバイスピクセルではない:

@media screen and (width: 360px) and (height: 640px) and (-webkit-device-pixel-ratio: 3) { ... 
関連する問題