JavaScriptで画面サイズによって表示非表示

CSSメディアクエリでdisplay:noneが使えないケースで質問させてください。

・JavaScriptでアクセス元の画面サイズを取得し、
・CSSメディアクエリのように900px以下なら<img src="1.jpg">を非表示、
・900px以上なら<img src="1.jpg">を表示、

のようにHTMLタグをコントロールしたいです。

JavaSctiptはdocument write()位しかわかりません。
どなたかご存知の方がいらっしゃったら教えて頂けませんでしょうか。

よろしくお願いいたします。

No.2 ベストアンサー 回答者： balloon23 回答日時： 2014/07/26 13:57

前にどこかのサイトで書かれていたものの受け売りですが。

。。

//　ここから　
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>

間違っているのかもしれませんが・・・(^_^;)
とても助かりました！

お礼日時：2014/07/28 13:29

No.1 回答者： ORUKA1951 回答日時： 2014/07/21 08:53

＞CSSメディアクエリでdisplay:noneが使えないケースで質問させてください。

　はなぜ？？
　小さなディスプレイとなると、スマホかフィーチャーホン、スマホはすべてmediaquery使えるでしょうし、フィーチャーホンでしたらmedia="handheld"が使えるはずですけど。
　

この回答への補足

ご質問ありがとうございます。
理由は、display:noneで表示をコントロールすることが制限されているコードを記述するためです。
（1ページのHTMLあたりの記述回数に制限があるコードで、こちらでは簡易的にimgタグを例としました）
宜しくお願い申し上げます。

補足日時：2014/07/21 10:37