質問: z-indexで上になっている要素だけでなく下の要素も上の要素のリンクもクリックしたい。 ブロックレベル要素が重なってz-indexの数値で上下関係を決めた場合に重なっている部分では、 通常はz-indexの数値が大きい方にはアクセスできるけれど小さい数値の方にはアクセスできないと思います。 重なっている部分ではz-indexの数値が小さい方はテキストの選択もリンクのクリックもできないと思います。 ですが、私は重なっている上下の両方の要素にアクセスしないといけなくなりました。 上だけ、下だけにアクセスする方法は分かります。 両方にアクセスするにはどうしたら良いでしょうか。 単純化して試している下記の通りです。 緑色の四角の内、ピンクの枠で囲まれている所、 左のリンク「55」をクリックできて、テキスト「666」を選択できて、 右のリンク「3333」「5555」をクリックできて、とテキスト「44」「66」を選択できるようにしたいです。 ちなみに、実際のソースではin_menuとin_contentsはiframeです。divでもできなかったので、divで質問させていただきました。 よろしくお願いします。 *{font-size:18px;} .menu{width:300px;height:50px;background-color:red;text-align:left;} .in_menu{width:250px;height:150px;border:10px solid pink;} .contents{width:250px;height:200px;margin-left:20px;background-color:blue;} .in_contents{width:250px;height:150px;margin-left:20px;background-color:green;text-align:right;} .footer{width:200px;height:40px;background-color:black;} .menu{z-index:0;} .in_menu{position:relative;z-index:3;} .contents{z-index:1;} .in_contents{z-index:2;} .in_menu{pointer-events: auto;} .in_contents{pointer-events: auto;} 11112222 33334444 55556666 11112222 33334444 55556666
回答: なんかすごいもん作ろうとしてるんですねえ。 がんばってください。 11112222 こんな感じで一行ずつくくり、 #text01 { position: relative; z-index:9999; } みたいな感じじゃだめですかね? 平たく言えば、z-indexでどんな要素よりも上にする、というもんですわ。 できっかなあ。やってないからわからないけど、位置もつけてabsoluteの方がいいか。それでもダメならfixedだったら確実できるね。ちょっと使いづらいけど。