Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS/CSS] pozycjonowanie, przeźroczystość
Forum PHP.pl > Forum > Przedszkole
Moorti
Witam,
Jestem nowy na tym forum trochę zielony w kwestii JS i nie doskonały w CSS..

1.Pozycjonowanie
mam skrypt który wyświetla ukrytego diva jako popup

skrypt wygląda tak:
Kod
<script type="text/javascript">
    function toggle_vis(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
</script>


link otwierający/zamykający diva tak:
Kod
<a href="javascript: toggle_vis('popup');">pokaż diva</a>


div:
Kod
<div id="popup" style="display: none;">
    tekst w divie
</div>


css dla diva:
Kod
#popup {
    position: absolute; left:50%; top:50%;
    padding: 20px 20px 20px 20px;
    height: 200px;
    width: 400px;
    border: 1px solid #000;
    background-color: #fff;
}


OK. Wszystko działa dobrze tylko nie do końca ;p
wyświetla tego diva ale nie na środku strony
position: absolute; left:50%; top:50%;
to powoduje ze div wyświetla się od tej pozycji
a ja chce idealnie na środku
wiem że można sobie policzyć i wpisać wartość w px tak żeby było pośrodku ale div zmienia pozycje gdy jest inna rozdzielczośc lub zmianiona wiekośc diva.
A mi chodzi o to zeby było zawsze idealnie na srodku tak jak jest to np. w Lightbox

2. Przeźroczystość
i znów nawiązanie do Lightboxa jak zrobić takie czarne półprzezroczyste tło
próbowałem robić diva w divie ale ten który znajdował sie w divie przezroczystym tez był przeźroczysty i nie dało sie ustawić diva tego pierwszego na 100% długości strony w CSS.


Mam nadzieję że zrozumieliście o co chodzi...
ayeo
Witaj!

Tego diva co chcesz wyśrodkować to nie rób jako absolute. Jako absolute zrób sobie tzw kontener (width: 100%; position: absolute, background: black; opacity: 0.5;) Do niego wstaw swojego diva i ustaw margin: auto; Co do przeźroczystości to patrz wyżej (opacity);

Pozdrawiam!
Moorti
tak tylko jak już mówiłem jesli mam coś takiego

div przeźroczysty a w nim div który chce żeby był nieprzeźroczysty to i tak jest choć dałbym opacity: 1.0; dla tego diva
to można zastąpić przezroczystym .png lub .gif

ale nie mogę wyśrodkować tego drugiego diva wewnątrz jak dam margin: auto; to jest owszem na środku ale przy górnej krawędzi a ja chce to całkiem na środku strony ;p
erix
Może to Ci pomoże: http://www.jakpsatweb.cz/css/css-vertical-...r-solution.html
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.