一部の要素が Android と iPhone でのみ表示されるページを作成しようとしています。要素を非表示にするために単純な css プロパティを使用することを考えていました。
HTML:
<style>img{ display:none;} </style>
<img src="img1.jpg" class="other">
<img src="img2.jpg" class="iphone android">
<img src="img3.jpg" class="iphone">
<img src="img4.jpg" class="android">
<img src="img5.jpg" class="iphone android other">
CSS 1 (iphone / android 以外のデバイス用)
.other{ display:inline;}
CSS 2 (iPhone 用)
.iphone{ display:inline;}
CSS 3 (アンドロイド用)
.android{ display:inline;}
今必要なのは、何らかの方法でデバイスを検出することだけです (jQuery で実行でき、正しい CSS スタイルシートを実装できると思います)。
したがって、効果は次のようになります。
img1: iphone、android以外の端末のみ表示
img2: iphone および android デバイスでのみ表示されます
img3: iPhoneのみ表示
img4: Android デバイスでのみ表示されます
img5: すべてのデバイスでのみ表示
ここで別の質問をしましたが、重要なトリッキーなことが 1 つあります。すべてを適用した後、後で変更する必要があるのは HTML だけです。後で jquery と css ファイルを変更することはできません。各画像にのみ手動でクラスを追加できるため、操作できるのは、純粋な html からクラスを手動で追加および削除することだけです。どうすればいいですか?したがって、class="iphone android" を追加すると、この 2 つのシステムで画像が表示されます。また、一般的にはiOXでできますか?iPhone、iPod、iPadなどで動作しますか?. あなたの助けと時間をありがとう。
ところで。私はさまざまな解像度でそれを行う方法を知っていますが、ここではオペレーティングシステムごとに特別に必要なので、ユーザーをAndroidマーケットに導くボタンがある場合、特定のボタン/画像をAndroidデバイスにのみ表示する必要があります...など ありがとう