CSSメディアクエリでdisplay:noneが使えないケースで質問させてください。
・JavaScriptでアクセス元の画面サイズを取得し、
・CSSメディアクエリのように900px以下なら<img src="1.jpg">を非表示、
・900px以上なら<img src="1.jpg">を表示、
のようにHTMLタグをコントロールしたいです。
JavaSctiptはdocument write()位しかわかりません。
どなたかご存知の方がいらっしゃったら教えて頂けませんでしょうか。
よろしくお願いいたします。
No.2ベストアンサー
- 回答日時:
前にどこかのサイトで書かれていたものの受け売りですが。
。。// ここから
var w = window.innerWidth;
var x = 900;
if( w <= x) {
viewtype = 'sp';
} else {
viewtype = 'pc';
}
// ここまで
あとは目的の場所に書き込めばOKだと思います。
たぶん。
ありがとうございました。教えて頂いたものを下のようにして実現することができました。
<script>
var w = window.innerWidth;
var x = 900;
if( w <= x) {
document.write("<img src="1.jpg">");
} else {
document.write("");
}
</script>
間違っているのかもしれませんが・・・(^_^;)
とても助かりました!
No.1
- 回答日時:
>CSSメディアクエリでdisplay:noneが使えないケースで質問させてください。
はなぜ??
小さなディスプレイとなると、スマホかフィーチャーホン、スマホはすべてmediaquery使えるでしょうし、フィーチャーホンでしたらmedia="handheld"が使えるはずですけど。
この回答への補足
ご質問ありがとうございます。
理由は、display:noneで表示をコントロールすることが制限されているコードを記述するためです。
(1ページのHTMLあたりの記述回数に制限があるコードで、こちらでは簡易的にimgタグを例としました)
宜しくお願い申し上げます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- Perl 画像が表示でnull; this.src 1 2022/04/19 11:31
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- PHP PHP echo バックスラッシュの使い方 img要素 2 2023/01/08 22:46
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
これはどんなJavaScriptなので...
-
outlook2010の不具合で困ってい...
-
jQueryでサーバー上のファイル...
-
透過pngの透明部分以外をクリッ...
-
jQueryでタブ切り替え
-
jQueryでシンプルドラッグドロ...
-
javascriptテキストBOX色を元に...
-
jQueryでネスト構造の<li>がク...
-
変数内容をHTML内で表示する方法
-
「jQuery」アコーディオンメニ...
-
「画像クリックで音声再生」を ...
-
JavaScriptで、?マークとコロ...
-
jQueryでヒアドキュメントを使...
-
1枚の画像をクリックして複数の...
-
画像を切り替えランダム表示
-
jQueryで同じid属性が複数あっ...
-
JSPでの画像ファイル表示
-
javaを使ってマウスオンでの画...
-
JimdoでWebアイコンフォントの...
-
javascriptによる画像切り替え...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
画像の座標位置取得
-
window.openで値の渡し方を教え...
-
画像と文字を同時に切り替えたい
-
jQueryで画像を重ねる
-
this.src等のthisについて
-
画像の下に説明文をつけて切り...
-
画像をクリックすると別ウイン...
-
JAVAで画像をボタンで切り替え...
-
クリックで次の画像へ
-
imgのsrcに値を設定するには
-
画像アップロードしたい
-
複数の画像の中から複数の画像...
-
画像をクリックして変数に値を代入
-
jQueryでサーバー上のファイル...
-
複数のバナーをリロードする度...
-
タイマーをデジタル時計風にす...
-
divの背景画像を、徐々に表示さ...
-
スマートな外部javaでロールオ...
-
一定時間で画像を変更するスク...
-
連番画像「次へ」「前へ」で、...
おすすめ情報