Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Wykorzystanie JS w CSS
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
kapitan kloss
Czy jest jakas mozliwosc na wykorzystanie szerokosci strony pobieranej z JS w css?
Kod
<script type="text/javascript">
    winwidth=document.all?document.body.clientwidth:window.innerWidth;
    winHeight=document.all?document.body.clientHeight:window.innerHeight;
</script>


Potrzebuje te wartosci podstawic w kodzie, poniewaz potrzebuje miec uklad 3-kolumnowy z zadana minimalna szerokoscia kolumny srodkowej i wypelniajacymi pozostala przestrzen ekranu lewa i prawa. Chodzi o to ze przy duzym zmniejszeniu szerokosci okna przegladarki, prawa kolumna ucieka mi na dol, a nie moge ich zlapac wszystkich w jeden DIV (pod divem znajduje sie obszar klikalny).

Kod
.lewa {
    background-color:red;
    width:40%;
    min-width:100px;
}
.srodek {
    background-color:blue;
    width:20%;
    min-width:100px;
}
.prawa {
    background-color:yellow;
    width:39%;
    min-width:100px;
    overflow:hidden;
}
kamil4u
W JS zmień szerokość zaraz po wczytaniu strony.
Kod
document.getElementById('test').style.width = 'wartość';

Nadaj id elementom i umieść kod w zdarzeniu onload.
Shili
@up

style.width zadziała tylko dla stylów inline.

http://www.quirksmode.org/dom/getstyles.html

@down
Faktycznie, przepraszam za niedoczytanie i za zamieszanie.
Styl inline natomiast jest to styl umieszczony w atrybucie html style (z ang. inline style sheet)
kamil4u
@Shili: el.style.width zmienia w CSS wartość width, czyli to co chce zmienić autor tematu. Ty mówisz o pobieraniu stylu, a nie o ustwianiu. Przy pobieraniu musisz uwzględnić także tzn. box-model, czyli również obramowanie i padding. I co to jest styl inline?
erix
Cytat
Potrzebuje te wartosci podstawic w kodzie, poniewaz potrzebuje miec uklad 3-kolumnowy z zadana minimalna szerokoscia kolumny srodkowej i wypelniajacymi pozostala przestrzen ekranu lewa i prawa. Chodzi o to ze przy duzym zmniejszeniu szerokosci okna przegladarki, prawa kolumna ucieka mi na dol, a nie moge ich zlapac wszystkich w jeden DIV (pod divem znajduje sie obszar klikalny).

Od tego są media queries.
kapitan kloss
No fajnie - media queries, ale jak chce mieć styl zawsze włączony. Robienie oddzielnych plików dla różnych szerokości jest absurdalne. Potrzebuje miec trzy kolumnowy uklad na stronie przy zalozeniu srodkowej kolumny o szerokosci np. 100px. Taka sytuacja powoduje, że ustalenie kolumn pobocznych na zasadzie 40%+40% powoduje ze prawa kolumna będzie mi znikać. Mogę zadać parametr overflow, ale tylko wtedy kiedy wszystkie kolumny sa zalaczone w jednej warstwie - a tego zrobić mi znowu nie można.

Ręce mi już odpadają od kodowania - bo efektów nie widać. Stąd pomysł ściągania (ale na bieżąco) jaka jest szerokość okna.
Rozumiem że nie da się tego zrobić.

Zrobiłem tylko z wykorzystaniem CSS - działa, może nie doskonale, ale działa.
erix
Cytat
No fajnie - media queries, ale jak chce mieć styl zawsze włączony. Robienie oddzielnych plików dla różnych szerokości jest absurdalne. Potrzebuje miec trzy kolumnowy uklad na stronie przy zalozeniu srodkowej kolumny o szerokosci np. 100px.

Najpierw sprawdzamy, czy mamy pojęcie, potem krytykujemy:
  1. @media all and (min-width:500px) { … }
  2. @media (min-width:500px) { … }

Żadnych osobnych plików.
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.