Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów
znowu ja - dopasowanie rozdzialki - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: znowu ja - dopasowanie rozdzialki (/thread-znowu-ja-dopasowanie-rozdzialki)

znowu ja - dopasowanie rozdzialki - rsk - 28-09-2010

witam poraz kolejny, troche znowu uprzykrze komus zycie Smile

tym razem moj problem polega na tym ze chcialbym zeby strone pobierala od przegladarki jaka rozdzielczosc posiada uzytkowanik i zeby automatycznie dopasowywala wielkosc strony do niej, slyszalem o czyms takim lub o czyms podobonym, wie moze ktos jak to zrobic ?

RE: znowu ja - dopasowanie rozdzialki - dziamber - 28-09-2010



RE: znowu ja - dopasowanie rozdzialki - ixtab - 29-09-2010

Kod:
<script type="text/javascript">
    var winW = 0, winH = 0;

    if (parseInt(navigator.appVersion)>3) {
        if (navigator.appName=="Netscape") {
            winW = window.innerWidth-16;
            winH = window.innerHeight-16;
            }
        if (navigator.appName.indexOf("Microsoft")!=-1) {
            winW = document.body.offsetWidth;
            winH = document.body.offsetHeight;
        }
    }
    if (winW <= 1024) {
        //  alert(winW);
        document.write('<link rel="stylesheet" type="text/css" href="css/detect_small.css">');
    }
    </script>
Skrypt po krótce działa tak, że jeśli szerokość okna przeglądarki jest mniejsza od 1024 to ładuje plik z CSS dla małych ekranów. Skrypt na szybko.
Ja jednak nie jestem zwolennikiem JS, bo niektórzy mają jego obsługę po prostu wyłączoną, zwłaszcza w firmach (a to moja grupa docelowa). Dlatego osobiście polecam CSS.
Kod:
body {
    margin:0;
    padding:0;
    width:100%;
    height:100%;
}
.div-na-100-procent-rozmiaru-przegladarki {
    max-height:100%;
    min-width:800px;
    width:auto;
    height:100%;
    position:absolute;
    top:0;
    left:0;
}
W IE6 nie zadziała, ale możemy napisać osobny CSS, więc w index.html piszesz w sekcji HEAD:
Kod:
<!--[if IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

a w pliku ie6.css używamy expressions:
Kod:
.div-na-100-procent-rozmiaru-przegladarki{
      width: expression((m=document.documentElement.clientWidth-10)+'px');
      height: expression((m=document.documentElement.clientHeight-10)+'px');
    }
PS. ten kod CSS wykrywa wysokość, łatwo sam go przerobisz aby wykrył szerokość. Ale nie używaj dla szerokości i wysokości bo nieciekawy efekt będzie.