Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML]Przezroczysty div na calej wysokosci strony.
cros
post
Post #1





Grupa: Zarejestrowani
Postów: 164
Pomógł: 21
Dołączył: 21.08.2009

Ostrzeżenie: (0%)
-----


Chodzi o to, ze chce przykryc cala zawartosc strony divem (polprzezroczystym), w ktorym mam zamiar umiescic panel logowania.
Stosuje taki kod (w uproszczeniu)
Kod
<div id="tresc strony" style="z-index: 1; width:100%; height:100%; background-color:#ffffff; text-align:center;">
...jakas tresc strony...
</div>
<div id="zaslona_logowanie" style="z-index 2; position: absolute; left: 0px; top:0px; background-color:black; filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; width:100%; height:100%;">
...panel logowania...
</div>

Niby wszystko ok, ale gdy tresc strony jest dluzsza (wyzsza) od wysokosci okna przegladarki, to przykryta zostaje tylko czesc strony, a gdy scrollbarem zjade nizej,
to strona juz wyglada normalnie.
Wiem ze jest taka mozliwosc, bo widuje to na innych stronach, ale pomimo setek prob, nie udaje mi sie osiagnac takiego efektu.
Strona, na ktorej zawartosc zostaje calkowicie przykryta, nawet jak zjedzie sie scrollem na sam dol: KLIK, wystarczy kliknac w sugestie, ktore znajduja sie po prawej stronie (z boku), a strona calkowicie zostaje przyciemniona.
Zna ktos rozwiazanie?

Ten post edytował cros 19.04.2010, 16:13:38
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
Szeszek1992
post
Post #2





Grupa: Zarejestrowani
Postów: 117
Pomógł: 29
Dołączył: 20.05.2009

Ostrzeżenie: (0%)
-----


zastosuj position:fixed
Go to the top of the page
+Quote Post
cros
post
Post #3





Grupa: Zarejestrowani
Postów: 164
Pomógł: 21
Dołączył: 21.08.2009

Ostrzeżenie: (0%)
-----


Niestety "position:fixed;" nie dziala w IE, przez co divy nie nakladaja sie na siebie, tylko jeden jest pod drugim.
Czy sa jakies inne mozliwosci?

Ten post edytował cros 20.04.2010, 17:04:19
Go to the top of the page
+Quote Post
zegarek84
post
Post #4





Grupa: Zarejestrowani
Postów: 1 332
Pomógł: 294
Dołączył: 12.10.2008
Skąd: Olkusz

Ostrzeżenie: (0%)
-----


Cytat(cros @ 20.04.2010, 17:06:39 ) *
Niestety "position:fixed;" nie dziala w IE, przez co divy nie nakladaja sie na siebie, tylko jeden jest pod drugim.
Czy sa jakies inne mozliwosci?

są 2 a nawet 3 rozwiązania...

ie7 obsługuje position fixed -> musi być w trybie standardów...

w ie6 można zemulować to przez odpowiednie ułożenie warstw i nadanie position absolute -> wniosek?? jest position fixed ale leniwy microsoft ;p :
CSS Emulating Fixed Positoning -> Prosty sposób na IE

dalej... w sieci jest fajny skrypt -> google i klep jak najszybciej "ie7 javascript" (lub js - projekt hostowany przez google)... i działa position fixed na ie6 (IMG:style_emoticons/default/winksmiley.jpg)

to pseudo trzecie rozwiązanie już nie jest rewelacyjne gdyż polega na tym, iż masz warstwę z całą stroną rozciągniętą... dajesz jej position relative i na końcu niej (jeszcze w niej ale na końcu) dodajesz tą warstwę co chciałeś z position absolute... dajesz left i top 0px i height (pewnie błąd ;p) 100% i szerokość 100% - rozciągnie się na całą warstwę ale będzie można niestety przewijać -> więc pierwsze 2 rozwiązania do tego lepiej będą wyglądać (IMG:style_emoticons/default/winksmiley.jpg)

ps. w ie6 png przezroczystość jest ale nie pamiętam jakie - bodajże na 8 bitów?? [sorki nie chcę w błąd wprowadzać - ale nie ma pełnej przezroczystości bez skryptów]

Ten post edytował zegarek84 20.04.2010, 19:37:47
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 9.10.2025 - 00:21