увеличение z-index div слоёв при нажатии на них
Даны 2 слоя, у первого z-index 100 у второго 101. Надо чтобы при нажатии на первый слой z-index у него стал больше чем у второго, к примеру 102, то есть чтобы он делался поверх второго. Затем нажатием на второй он тоже увеличивал свой z-index, например 103, становясь поверх первого и так до бесконечности.
Вобщем что-то вроде onclick : z-index +2 нужно на каждый слой. Как это реализовать? |
onclick="this.style.zInsex=this.style.zInsex+2"
|
Цитата:
Нужный элемент находится ПОД другим элемнтом. To ТС: Кусок кода покажите. |
Вообще если элемента 2, то просто взаимозаменять их z-index, иначе:
<script> zindex = 102 </script> <h1 style="position:relative;background:#eef;" onclick="style.zIndex = zindex++">1</h1> <h1 style="position:relative;background:#fee;top:-1.2em" onclick="style.zIndex = zindex++">2</h1> |
а если элементов больше чем 2? в моём случае их 5.. как бы сделать так, чтобы жмёшь на слой и он становился поверх всех, жмёшь на другой и он становился поверх всех..
может как-то можно сделать так, чтобы по клику на слой у него z-index прибавлялся, а у остальных слоёв при этом происходил возврат z-index к значению по-умолчанию? и так бы происходило у каждого слоя по которому кликаешь. бесконечное прибавление z-index на практике оказалась не очень, так как если кликнуть допустим несколько раз, то и по другому надо кликать несколько раз и так как слоёв 5 штук, я не учёл, что для остальных слоёв, чтобы достич z-index предыдущих, надо будет кликать уже много раз, а не один, как было бы нужно.. цитировать кусок кода не вижу смысла, так как это не имеет значения, эта идея абсолютно отдельно идёт от других. |
Потому что непонятно - чего Вы хотите!
Слои полностью перекрывают друг-друга? Как же тогда определять по какому слою Вы собирались кликать? [telepate mode]? Если слои не перекрываются полностью (т.е. можно отследить клик по конкретному слою) - тогда тут и думать нечего... |
слои как друг друга перекрывают? если полностью — на нижний просто невозможно кликнуть, а если частично:
var myelem = this.style.zIndex; var allelem = getElementsByTagName('div').style.zIndex; var leng = allelem.lenght; while (leng--){ if (myelem < allelem[leng]){ myelem.style.zIndex = allelem[leng]+2; } else { myelem.style.zIndex +=2 } } по синтаксису могу ошибаться, но логика такая :) |
Цитата:
|
да я наверное забыл сказать что все слои можно сворачивать и двигать, так что если они перекрывают друг друга, то можно слой отодвинуть и перекрывания не будет, вобщем задумка как в окнах ОС Windows. Не хватает только перемещения слоя на передний план при клике на него. чтож, попробую предложенные решения, потом скажу получилось или нет.
да вот код от Aetae вроде работает немного поменял значения и получилось, спасибо большое :) всем + за внимание |
и я ещё добавил onmousedown="style.zIndex = zindex++" так работает корректней)
|
Часовой пояс GMT +3, время: 11:56. |