表示エリアサイズで判別してstyleを指定したい。

質問

表示エリアサイズ(幅)を取得して900より広く1000より狭かった時だけ
横スクロールバーを非表示にしたいのですが、javascriptが苦手なため
教えていただけませんでしょうか。
自分なりにやってみたのですが、ダメでした。

window.onload = setScreenStyle;
window.onresize = setScreenStyle;

function setScreenStyle(){
var sss = document.documentElement.clientWidth;
if (sss < 1000&&sss > 900){
document.html.style.overflow-x = "hidden";
}else{
document.html.style.overflow-x = "auto";
}
};

bodyタグにoverflowを設定してもIEだと無視されてしまうようなのでhtmlタグに対して
overflow-x:hidden;　を指定したいのですが、ご教授の程よろしくお願いいたします。

回答No.1

reggaepunc · ベストアンサー

----------------------------------------
var htmlTag = document.documentElement;
htmlTag.style.overflowX = 'scroll';
---------------------------------------
↑これでhtmlタグにoverflow-x:scroll;
が効きました。

お礼

回答ありがとうございます。
いただいた例を参考にして以下のようにしたところ、希望の動作が
確認できました。

window.onload = setScreenStyle;
window.onresize = setScreenStyle;

function setScreenStyle(){
var sss = document.documentElement.clientWidth;
var htmlTag = document.documentElement;
if (sss>=900){
if (sss<=1000){
htmlTag.style.overflowX = 'hidden';
}
}else{
htmlTag.style.overflowX = 'scroll';
}
};