Jei esate interneto dizaineris, klaida vadinamaPožiūrio mastelio keitimas galėjo susidurti su „Apple“ įrenginiais, t. Y. „IPod“, „iPhone“ ir „iPad“. Kartais, kai pasukame „Apple“ įrenginį nuo portreto į orientaciją į kraštovaizdį, svetainė priartinama ir parodomas vaizdas, kurio plotis yra didesnis už įrenginio plotį. Taip yra todėl, kad dizaineris peržiūros srities plotį nustatė pagal įrenginio plotį. Norėdami padėti susidaryti idėją, kaip ši klaida veikia, sukūrėme pavyzdinį puslapį ir pasukome „iPad“ iš portreto į kraštovaizdžio vaizdą.
Greitas minėtos klaidos taisymas padeda mums nustatyti„Maxim-scale = 1“ peržiūros srities metažymoje. Kol kas tai išsprendžia problemą, tačiau puslapis nebeįmanoma padidinti mastelio, nes nustatome maksimalų plotį, panašų į įrenginio plotį.
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">
Šis greitas ištaisymas nėra visiškai tobulas sprendimas. Atlikdami sunkų dizainerių, tokių kaip @mathias, @cheeaun ir @jdalton, darbą, mes turime „javascript“, kurį galima pridėti į skyrių <head>, kad gautume nuolatinį sprendimą. Pagal šį sprendimą puslapis bus toliau didinamas.
<script type="text/javascript">
(function(doc) {
var addEvent = "addEventListener",
type = "gesturestart",
qsa = "querySelectorAll",
scales = [1, 1],
meta = qsa in doc ? doc[qsa]("meta[name=viewport]") : [];
function fix() {
meta.content = "width=device-width,minimum-scale=" + scales[0] + ",maximum-scale=" + scales[1];
doc.removeEventListener(type, fix, true);
}
if ((meta = meta[meta.length - 1]) && addEvent in doc) {
fix();
scales = [.25, 1.6];
doc[addEvent](type, fix, true);
}
}(document));
</script>Tai yra vieninteliai žinomi sprendimai, kuriuos iki šiol sugalvojo dizaineriai. Bet jei turite dar vieną, kuris ištaisys šią klaidą, pasidalykite ja su mumis komentaruose.
Komentarai