横スクロール禁止

ウィンドウの横スクロールバーを表示しない設定。
bodyだけに設定しても表示されてしまったので、htmlにも指定してみたら消えた。
謎。

html{
overflow-x : hidden;
overflow-y : auto;
}

body{
overflow-x : hidden;
overflow-y : auto;
}

注意点として、JavaScriptなどでscrollbars=noでウィンドウを開いていると
そちらが優先されてしまい、縦スクロールも表示されなくなる。
scrollbars=yesで開いてからCSSで指定すること。

selectboxがメニューの上に表示される

カーソルを当てると表示されるようなメニューを作っていると
しばしば遭遇する現象。ただしIEのみ。
重なりが悪いのかと、z-indexを設定しても駄目。
それもその筈でselectboxを制御しているのはブラウザではなく
OSなのだそうだ。
ゲイツめ・・・！

何故かiframeはselectboxの上に表示できるので＜div＞の下にダミーの
＜iframe＞を入れ込めば良い。（shimって言うらしい）
bodyに＜iframe scrolling="no" frameborder="0" id="shim"＞＜/iframe＞
を記述しておいて、Javascriptのdisplay属性を切り替えるところに

setShim(element);

を追加。setShimの中身はこんな。elementで渡してるのは当然div。

function setShim(obj) {
var shim = document.getElementById('shim');

// サイズ、位置を合わせる
shim.style.left = obj.style.left;
shim.style.top = obj.style.top;
shim.style.width = obj.offsetWidth;
shim.style.height = obj.offsetHeight;
shim.style.display = 'block';
}

な感じ。ふむ。