Witam!
Posiadam stronę internetową w wersji reponsywnej, w której wersja z najwęższą szerokością ma wartość 566px. W mniejszych urządzeniach, mających może 320-400px , strona jest widoczna w połowie (chciałbym żeby była w całości widoczna).
Z pewnością rozwiązaniem byłoby stworzenie wersji dla szerokości ok. 320px, jednak niektórych rzeczy (np. tabel z danymi) nie jestem w stanie zwężyć do takiej szerokości. Czy da się zrobić tak, aby strona w wersji responsywnej była w skali 1:1 ?
Dodam, że dopiero raczkuję w temacie stron responsywnych. Mam też na stronie taką wartość meta tagu "viewport":
<meta name="viewport" content="width=device-width, initial-scale=1">
Pełna wersja: Problem ze stroną responsywną
Możesz spróbować:
1.
Jeszcze chyba słabe wsparcie.
2.
3. Sprawdzić za pomocą JS szerokość ekranu, jeśli mniejsza niż 566 to wstrzyknąć do HEAD metatag:
1.
Kod
@media screen and (max-width:565px) {
@viewport{
zoom:0.5;
}
}
@viewport{
zoom:0.5;
}
}
Jeszcze chyba słabe wsparcie.
2.
Kod
@media screen and (max-width:565px) {
body{
-webkit-transform:scale(0.5);
-moz-transform:scale(0.5);
-o-transform:scale(0.5);
-ms-transform:scale(0.5);
transform:scale(0.5);
}
}
body{
-webkit-transform:scale(0.5);
-moz-transform:scale(0.5);
-o-transform:scale(0.5);
-ms-transform:scale(0.5);
transform:scale(0.5);
}
}
3. Sprawdzić za pomocą JS szerokość ekranu, jeśli mniejsza niż 566 to wstrzyknąć do HEAD metatag:
Kod
<meta name="viewport" content="width=device-width, initial-scale=0.5">
Cytat(adam882 @ 13.10.2014, 18:30:40 ) 
Z pewnością rozwiązaniem byłoby stworzenie wersji dla szerokości ok. 320px, jednak niektórych rzeczy (np. tabel z danymi) nie jestem w stanie zwężyć do takiej szerokości. Czy da się zrobić tak, aby strona w wersji responsywnej była w skali 1:1 ?
może nie wiele doradzę ale pod wersję mobilną możesz z tabelkami zrobić 2 rzeczy jeszcze... albo tabelkę wstawić do jakiejś warstwy np. "div'a" i ustawić overflow na przewijanie w bok jeśli kogoś ta tabelka zainteresuje... lub odwrócić tabelkę jeśli jest szersza niż wyższa i dane przedstawić z góry w dół...
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.