Forum PHP.pl > [CSS][JavaScript] Problem z z index dla obrazka

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS][JavaScript] Problem z z index dla obrazka

Woytek950

3.12.2011, 19:01:06

Witam. Mam problem z z-index i wygląda on następująco:
dlaczego ta prosta funkcja nie "wyrzuci" obrazka nr 3 na sam wierzch?

[HTML] pobierz, plaintext 
function changeStyleOnHover()
{
 
  document.getElementById("imgThird").style.zIndex='5';
}
 
 
<div onmouseover="changeStyleOnHover()">div<div>
<img src="1.jpg" alt="" style="z-index: 4;" id="imgFirst" />
<img src="2.jpg" alt="" style="z-index: 4;" id="imgSecond" />
<img src="3.jpg" alt="" style="z-index: 4;" id="imgThird" />
[HTML] pobierz, plaintext

amii

3.12.2011, 19:34:47

Ustaw pozycjonowanie dla elementów, po za tym jeśli nie zmieniasz położenia to nic nie zobaczysz:
Przetestuj to:

[HTML] pobierz, plaintext 
<html>
<head>
<script type="text/javascript">
    function changeStyleOnHover()
    {
 
    var doc = document.getElementById("imgThird");
    doc.style.zIndex='9999';
    doc.style.left = -10;
    doc.style.top = -10;
 
    }
  </script>   
 
    <div onmouseover="changeStyleOnHover()">div<div>
    <img src="1.jpg" alt="" style="z-index: 2; position:absolute; " id="imgFirst" />
    <img src="2.jpg" alt="" style="z-index: 3; position:absolute; " id="imgSecond" />
    <img src="3.jpg" alt="" style="z-index: 4; position:absolute; left:100px; " id="imgThird" />
 
</body>
</html> 
[HTML] pobierz, plaintext

tutaj: http://www.w3schools.com/js/tryit.asp?filename=tryjs_events

Woytek950

3.12.2011, 19:43:05

Zapomniałem napisac ale wszystkie obrazki były w pozycji absolute i jeden na drugim

Edit: dopiero teraz się skapnąłem że obrazek miał w stylach ustawione na display:none; męczyłem się z tym 3h.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.