ホームページのCSSの重なり順序の変更の方法を教えてください。

質問

ドリームウィーバーのＣＳＳのサンプルを使ってHPを作っていますが、z-indexを使って、idやclassの重なり順序を変えようと思いましたが、まったくz-indexが機能しません。z-indexを使うにあたり何か決まりごとがあるのでしょうか？また、他に重なり順序を変えるやり方があれば教えてください。ちなみに僕がやりたいことは、BiglobeさんのＨＰみたいに、１番上の大見出しのメニューの上にマウスオーバーすると、そのカテゴリーの詳細見出しが下にズラズラっと出てくるようにジャバスクリプトを作っているのですが、その下に出てくる詳細の見出しが、大見出しの下に配置してあるidの下に隠れてしまい、見ることもクリックすることもできないので、その詳細見出しを１番上に持ってきたいのです。宜しくお願いします。

回答No.1

BLUEPIXY · ベストアンサー

z-indexを使う場合
position指定をしないといけません
（つまりデフォルトであるposition:static以外を指定する）
z-indexを指定しているものに
position:absolute
を一緒に指定してみてください

補足

position:absolute
をCSSに入れても、重なりは変えれませんでした。
ということはJavascriptに問題があるのでしょうか？
一応、書いてある Javascript　を記入します。
もし、おわかりでしたら教えてください。
宜しくお願いいたします。

<script type="text/javascript">
<!--
var time = 3000;
var numofitems = 8;

//menu constructor
function menu(allitems,thisitem,startstate){
callname= "gl"+thisitem;
divname="subglobal"+thisitem;
this.numberofmenuitems = 8;
this.caller = document.getElementById(callname);
this.thediv = document.getElementById(divname);
this.thediv.style.visibility = startstate;
}

//menu methods
function ehandler(event,theobj){
for (var i=1; i<= theobj.numberofmenuitems; i++){
var shutdiv =eval( "menuitem"+i+".thediv");
shutdiv.style.visibility="hidden";
}
theobj.thediv.style.visibility="visible";
}

function closesubnav(event){
if ((event.clientY <48)||(event.clientY > 300)){
for (var i=1; i<= numofitems; i++){
var shutdiv =eval('menuitem'+i+'.thediv');
shutdiv.style.visibility='hidden';
}
}
}
// -->
</script>

回答No.2

BLUEPIXY

#1>Javascriptに問題があるのでしょうか？
Javascriptの方で、特に重なりに関する問題はないと思います。
なんだったら、サイトのアドレスを教えてください。

お礼

ごめんなさい。修正できました。idの中にidを入れていたので、１番下にあるidにz-indexを指定してあげればできました。単純な私のミスでした。ありがとうございます。本当に的確なアドバイスありがとうございました。

補足

サイトのアドレスです。１回見てみてください。
ぜんぜんわかりません。まだ未完成ですが、宜しくお願いいたします。
http://www7a.biglobe.ne.jp/~lex/aqua/index.html