2009年3月2日月曜日

Liteboxについての覚書


z-index_Image.jpg


cssでデザインするというのは色々気を使うものだ。特に、Liteboxなどのツールを利用する場合、仕様に気をつけなければいけない。


今回は、z-index要素。画像の3次元方向(重なり)の指定に利用するプロパティだ。


このブログ、見ての通りヘッダ部分にいくつか画像を配置している。こいつのz-indexを900とか800とかの値で指定していたのだが、Liteboxが動作する際、ブラックアウトせず残ってしまう。

調べてみた結果、どうやら100以上の値を指定した場合に前面に出てきてしまうらしい。

ということで、70-90の間で3つの画像のz-indexを指定した。目論見どおり、Litebox動作時にブラックアウトするようになった。

(もし、やってみてダメだったら教えてください。)

細かいことだが、確認するとしないとでは大違い。早めに気づけてよかった。