Использование Onclick для элементов с низким z-индексом - PullRequest
1 голос
/ 24 сентября 2010

Вот моя проблема - мне нужно как-то получить доступ к щелчку элемента, который покрыт другим элементом с более высоким z-индексом. Я знаю, что это идет против точки z-index, но есть идеи?

В приведенном ниже примере кликабельна только небольшая полоска красного прямоугольника. У меня есть дизайн веб-страницы, где вкладки, которые нужно нажимать, накладываются на хитрый бар ... Я бы хотел, чтобы был способ (может быть, какой-то трюк с JavaScript) использовать onclick для этих затемненных нижних элементов z-index без изменить любое положение, хотя мое внутреннее чувство не хорошо.

<html>
<head>
    <style type="text/css">

        #bg {
            position:absolute;
            width:500px;
            height:500px;
            background:pink;
        }
        #under {
            cursor:pointer;
            margin-top:-10px;
            background:red;
            width:50px;
            height:50px;
            z-index:0;
        }
        #over {
            position:absolute;
            width:900px;
            height:50px;
            margin-top:10px;
            z-index:100;
        }
    </style>
</head>
<body>
    <div id="bg">
        <div id="under" onclick="alert('hi');">aaa</div>
    </div>
    <div id="over"></div>
</body>

Ответы [ 2 ]

1 голос
/ 24 сентября 2010

Я бы сделал это с прозрачным PNG внутри DIV над вычурной полосой с такими же размерами, как у вашего кликабельного низшего z-index DIV.

Помните о проблемах Internet Explorer.

Я использовал эту технику много раз.

0 голосов
/ 24 сентября 2010

Обычный метод замены заключается в размещении «над» элементов (позиционируется абсолютно) внутри «под» элементов (позиционируется либо относительно, либо абсолютно) и делает содержимое одинакового размера ( Gilder / Levin Image Replacement ).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...