ハナモゲラボ / 試行錯誤の実験人生

日々、PCや各種デバイス、楽器等に翻弄されながら電脳の森をさまよう男の日常と様々な実験をさらりと記しております。

z-indexをいじりまくってたらリンクがクリック出来なくなった

December 04 2014

普段あんまり使う事のないz-indexなのですが、
もらったデザインを適用させるために使わなければならない事態となりました。
そして、それは見事にうまくいって一安心だったのだけども
レスポンシブサイトでスマホ表示した際に、右上にトグルスイッチを設置して
それをタップすればメニューバーがスライドして出てくるという仕掛けを実装した際
スライドしたメニューバーが配置したコンテンツの下をくぐってしまうという事態に。

こいつあ困ったぜ、とz-indexの値を色々いじって、
くぐってしまうボックスの親要素に負の値を与えてこの現象は回避。

これで一安心でい、と思ってたら次はその負の値を与えたボックス内に設置してる
テキストリンクがクリック出来なくなるという
もう次から次へとなんだコノヤロウという状態に。

色々調べてみたらz-indexは負の値を与えてしまうと、そこに配置した
リンクが動作しなくなるっぽい。

なので、そのくぐってしまうコンテンツのz-indexの値を0にして
それを基準にしてz-indexの値を全て調整してなんとかクリアしました。

全てをちゃんと実装してから、値を調整していくか、
それかマイナス数値は使わないようにしたほうが良いかもしれませんな。

というかスマホサイトって縦長なわけだから
ページを見終わった際に下部にナビゲーションメニューがあった方が
良さげな気もするんだけども、こればっかりはまあ・・・ねえ。

| Posted in CSS | Comments (0)

Post a Comment

※メールアドレス、URLは任意入力です。メールアドレスは入力しても公開されません。

« Jul 2017 August 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31