CSS - z-index nie działa poprawnie

Używam z-index na mojej stronie (-link już nie jest potrzebna-), i to nie działa poprawnie: nie umieszcza niektórych div ponad wszystkimi innymi.CSS - z-index nie działa poprawnie

Możesz to zobaczyć samodzielnie, klikając jedną z pozycji po lewej lub prawej stronie. Następnie maska zniknie, ale pojawi się okno komunikatu poniżej. Wiele już próbowałem, ale po prostu nie mogę wyświetlić okna komunikatu, aby pokazać przede wszystkim ...

Co mogę zrobić, aby to naprawić?[uwaga: 2-ta pytanie poniżej]

Jeśli nie chcesz, by sprawdzić tę stronę, okno komunikatu znajduje się w niektórych innych div:

<div> 
<div> 
    <div>message box</div> 
</div> 
</div>

CSS pozycjonowanie jest tak:

.window { 
    position: fixed; 
    left: 0px; 
    top: 0px; 
    z-index: 100; 
}

używam position: fixed, ponieważ position: absolute nie jest absolutna tu div nie jest dostosowana do ciała, ale jakoś coś innego. Czy istnieje sposób na zresetowanie pozycjonowania i położenie bezwzględne?

Źródło

2011-11-28 laarsk

+11

Indeks Z działa tylko wtedy, gdy jest stosowany do elementów, które mają ten sam typ pozycjonowania. Jeśli więc jeden element jest poza domem przez bezwzględną lub inną pozycję, to jego indeks Z nie będzie względny w stosunku do innych elementów w dom, ale tylko do elementów, które mają ten sam typ pozycjonowania. – Ryan

Oh ok, więc obiekt stały po prostu nie może nakładać się na obiekt absolutny? – laarsk

poprawne, ponieważ zgodnie z indeksem Z i domem w rzeczywistości nie są ze sobą spokrewnione, aw rzeczywistości, ponieważ obiekt absolutny jest poza domem, ustalony nie wie nawet, że jest na nim gotowy. – Ryan

Jeśli używasz jQuery sprawdzić top Z Index Plug In, można stosować ją, gdy obiekt ma myszy nad zdarzenia jak:

<div id="modal" onmouseover="$(this).topZIndex();"></div>

Następnie zmień pozycję na absolutny z jQuery lub też na odwrót:

$(document).ready(function(){ $('#modal').css('position','absolute'); });

Źródło

2011-11-28 21:53:47 raphie

Hmmm, to nie wygląda do pracy ... Zawarłem inny skrypt jQuery, ale teraz daje mi błąd, że okno launchWindow nie jest zdefiniowane ... żadna wskazówka co zrobić? Ponadto pozycja musi być "naprawiona", jak to opisano powyżej , czy to też zadziała? – laarsk

Teraz umieściłem wiersz '' powyżej innego skryptu i nie ma więcej błędów show.Ale problem z-index jest nadal taki sam ... – laarsk

Czy div wewnątrz iframe lub innego div? – raphie

screenshot

jeśli usunąć z-index z #leftbar to rozwiązuje problem. Pozycja nie powinna mieć znaczenia, o ile ją posiadasz.

Źródło

2011-11-28 21:58:20 Michael

Niestety, indeks Z jest potrzebny dla reszty strony :(Być może znasz inne rozwiązanie? – laarsk

po otwarciu popup, usuń #leftbar z-index, kiedy zamykasz wyskakujące okienko i dodajesz je ponownie. :) – Michael

Innym rozwiązaniem byłoby mieć układ 3 kolumnowy, w którym twoja mapa nie ma szerokości 100%, wtedy nie potrzebujesz z-index w kolumnach. – Michael

Odkąd pamiętam, problemy z indeksami Z często wynikają z faktu, że rodzice elementów z-indeksowanych nie są pozycjonowani. Rodzeństwo rodziców powinno być ustawione.

Źródło

2011-11-29 11:07:09

CSS - z-index nie działa poprawnie

Odpowiedz

Powiązane problemy