2012-10-26 21 views
16

Używam jQuery do tworzenia dziurki, kiedy klikam na przycisk -> tło powinno mieć nieprzezroczystość 0.8, a pojawiający się div pozwoli użytkownikowi na zalogowanie się - wszystko jest w porządku, gdy nie używam z- indeks, ale mam 4 elementy div (nagłówek, zawartość, stopkę i element div z formularzem logowania) nagłówek musi zawierać indeks Z: 3 i zawartość z-index: 2 - w przeciwnym razie cienie nie będą działać zgodnie z oczekiwaniami.z-index nie działa?

Z jQuery dodaję div po tagu body, który zawiera stronę pełną, więc mogę ustawić krycie, ale wtedy muszę ustawić indeks Z dla formy-div wyższy niż dla div z nieprzezroczystość - ale to nie działa. z-index formularza-div wynosi 999, drugi div ma 5

Jakiekolwiek obejścia lub coś dla z-index?

+2

Będziemy musieli zobaczyć HTML i CSS, aby dać ostateczną odpowiedź. – Dancrumb

+0

Z-index jest podchwytliwy. Musisz upewnić się, że włączasz elementy do "używania" z-index. 'position: relative;' dla elementów, które chcesz pozostać w przepływie dokumentu i 'position: absolute;' dla elementów poza przepływem dokumentów. Ponadto, IE7 ma "błąd" z-index, który opiera swój indeks na jego rodzica i że rodzice z-index jest porównywany do jego rodzeństwa w DOM. To może wywołać ból głowy. – jmbertucci

+0

Możliwy duplikat [Dlaczego z-index nie działa?] (Http://stackoverflow.com/q/9191803/1529630), ale nie może wiedzieć, ponieważ nie ma kodu. – Oriol

Odpowiedz

39

Zmień położenie elementu.

position: relative; 
+1

Oto dokumentacja: http://www.w3schools.com/cssref/pr_pos_z-index.asp – SamHuckaby

+0

już wypróbowany: -S - nie działa –

+8

@SamHuckaby: To nie jest "ta" dokumentacja. W3Schools nie jest W3C. Prawdziwa dokumentacja znajduje się tutaj: http://www.w3.org/TR/CSS21/visuren.html#z-index – BoltClock

2

Musisz się upewnić, że w twoim CSS zdefiniowano position. jeśli chcesz, aby z-index został zaimplementowany do zwykłego elementu HTML, a następnie dodaj element position:relative.

4

Stare pytanie, ale mimo wszystko opublikuję, jeśli ktoś inny szuka rozwiązania.

z-index nie jest tak proste, jak mogłoby się wydawać. Tworzenie z-indeksu na elemencie 1 = 999 i elemencie 2 = 1 nie zawsze oznacza, że ​​element1 będzie na pierwszym planie.

Miałem podobną sytuację jeden raz, a ja zmieniłem indeks z jQuery, gdy potrzebowałem tego elementu, aby był z przodu i działało dobrze. Oznacza to, że indeks Z dba o czas KIEDY dałeś mu ten indeks. Jeśli chcesz nadać mu wartość 999, oddaj ją dokładnie w momencie, gdy chcesz ją ustawić z góry. Może to sprawić, że pozostanie na szczycie, ale mogą obowiązywać inne reguły, a mianowicie: kolejność układania. Jest to dość obszerny temat do omówienia tutaj, więc po prostu wskazuję tutaj: http://philipwalton.com/articles/what-no-one-told-you-about-z-index/

4

Musisz coś zrobić z elementem-rodzicem.

przelew: widoczny;

To byś zrobił.

+0

Nie wiem, dlaczego ta odpowiedź dostał tylko jeden głos (mój). To właśnie uratowało moje **! –

+0

A teraz, gdy o tym pomyślałem, zdałem sobie sprawę, że moim problemem nie był wcale indeks Z. Element został po prostu odcięty, ponieważ wypłynął z rodzica (używając 'position: absolute'). –

+0

@GiladBarner Cieszę się, że mogę pomóc:) – steveluoxin