Diskuze: mobilní web
Člen
Zobrazeno 26 zpráv z 26.
Např. takhle, tento kód vložíš přímo do CSS:
@media only screen and (min-width: minimální šířka) and (max-width: maximální šířka){
//style
}Zde popisují standartní velikosti:
http://css-tricks.com/…ard-devices/
a toto musím vložit teda do každý stránky co mám na serveru, vytvořit nový soubor css, nebo stačí jenom do css který je dávno vytvořený a vložit do jednoho souboru, nevadí to teda
Můžeš mít různé css soubory pro různé media queries, nebo můžeš mít vše v jednom.
Vše v jednom (soubor css)
@media nejake pravidlo{
body{
background: red;
}
}
@media a jine pravidlo{
body{
background: blue;
}
}pro kazde media query vlastní css soubor (hlavička html)
<!doctype ...
<html>
<head>
...
<link rel="stylesheet" type="text/css" media="media nejake pravidlo" href="nejake-pravidlo.css" />
<link rel="stylesheet" type="text/css" media="media a jine pravidlo" href="jine-pravidlo.css" />
...
</head>
...
</html>Stačí do jednoho souboru, píšeš do toho styly jako obvykle, můžeš mít libovolný počet specifikací v jednom souboru.
Ještě bych dodal, že když máš nějakou vlastnost, která bude pro všechny stejná tak jí vlož na začátek souboru a nezakomponuj jí do žádné specifikace, bude společná pro všechny, ale půjde kdykoli přepsat pro jednotlivou specifikaci.
jo takže jsem to dal do jednoho souboru kde mám vše, a do toho jak je napsáno styly tam mám napsat teda to co mám při normální verzi
Do max-width a min-width si vložíš pro jakou velikost monitoru, př. zařízení to má být a potom do { } píšeš normálně styly, např.
@media only screen and (min-width: 1200px) and (max-width: 1800px){
header {width: 100%; height: 100px}
section > article {width: 400px}
// atd.
}Tedy bude to fungovat pro všechny monitory s šířkou mezi 1200 - 1800px.
jo takže to vyzkouším a jestli se mi to nepovede tak napíšu zatím díky
zatím to vypadá divně, mám hlavní stránku a text se mi zobrazil jenom v takovým proužku až dolů, text je nepřehledný, budu si muset vytvořit na serveru další složku a tam to bude ta mobilní verze, obrázek pod celou stránkou je tam víckrát, má být jenom jeden přes celou obrazovku.
no jo jenže jak to pak udělat aby to rozpoznalo normální web a web pro mobily, to bych vyřešil jak
že by podle těch rozlišení? 2. možnost je podle User-agentu v JS, ale to je prasárna na druhou, tak ti k tomu ani nic konkrétněji říkat nebudu.
Nevíme, co s tím vymýšlíš. Nahraj to na hosting a dej nám sem odkaz, třeba ti někdo poradí.
http://detectmobilebrowsers.com/ Pokud ti nefuguje to CSS, tak to udělej přes if() v PHPčku, můžeš potom i měnit text/zobrazovat obrázky v nižším rozlišení
Kód pro detekci mobilních prohlížečů, co se Ti na tom nelíbí?
takže když tam vložím to if přes php tak to teda vložím do souboru top.php to mám všade jako include, takže to tam mám dát teda
kdybyste nepoužívali ten zoom, tak mobil nemusíte příliš řešit. V media queris (viz kolegové výše) prostě zakryješ ty zbytečné panely s počasím atd.
panely mám v plánu dát pryč z tý mobilní verze
Musíš to rozlišit přes PHP a pokud si to nějak nanaroutuješ, tak tak
budeš mít v adrese ty ošklivé parametry. Není to vůbec praktické.
Pochopil bych vybírání přes Ajax, ale i přesto jsou tu od toho media
queries a ne těžkopádné PHP.
Proč bych měl blbý parametry? A je to lepší, protože můžeš zobrazit něco jiného na mobilní a něco jiného na normální verzi
no nic teď to nechám být protože mi nějak stávkuje stránka, píše mi
to
Jejda! Prohlížeči Google Chrome se nepodařilo připojit k serveru www.pharaon.wz.cz
Měli jste na mysli: www.wz.cz
takže pokračování asi až se to dá zpátky dohromady na jejich
serverech
Zobrazeno 26 zpráv z 26.