Mobilní verze stránek

Ahoj, Potřebuju se zeptat. Mám jeden problém a ten asi vyřeším jenom tím, že pro mobil udělám ty stránky s jiným pozadím a tím to nebude dělat bordel. Jenomže pomocí (teď si nevzpomenu na příkaz) rozlišení mi to nějak nejde. Je nějaká extra podmínka co pozná že se nejedná o stolní PC, ale jedná se o mobil, pomocí které bych mohl změnit to pozadí, aniž bych musel vytvářet stránky www.m.stránka.cz? Ale musí to být nějak jinak než přes rozlišení displaye..

Předmět	Autor	Datum
Vyhledat 'css media queries" nový asuseee 15.11.2015 17:24	asuseee	15.11.2015 17:24
To je "@media"? S tím sem dělal to rozlišení a nefungovalo mi to nový Tomy158 15.11.2015 17:29	Tomy158	15.11.2015 17:29
Tak to jsi to asi dělal špatně. nový Wikan 15.11.2015 17:30	Wikan	15.11.2015 17:30
Normálne do určitého rozlišení to funguje...ale od menšího rozlišení to nic nedělá a když to zmenším… nový Tomy158 15.11.2015 17:34	Tomy158	15.11.2015 17:34
To my taky ne, když neznáme tvé stránky. nový Wikan 15.11.2015 17:35	Wikan	15.11.2015 17:35
Pošli sem kod, nebo ještě líp sem : diskuse.jakpsatweb.cz nový asuseee 15.11.2015 17:34	asuseee	15.11.2015 17:34
Momentálně nemám k dispozici pc. Postačí ti odkaz na stránku? www.sdhbecva.cz nový Tomy158 15.11.2015 17:36	Tomy158	15.11.2015 17:36
background-color: lightgreen; nový Wikan 15.11.2015 17:39	Wikan	15.11.2015 17:39
Ale vždyť to tam nemám. Já potřebuju aby to pozadí mělo barvu #696969 nový _Tomáš__ 15.11.2015 19:11	_Tomáš__	15.11.2015 19:11
@media (min-width:1px) and (min-height:1px) and (max-width:540px) and (max-height:960px){ body{ back… nový _Tomáš__ 15.11.2015 19:12	_Tomáš__	15.11.2015 19:12
Ale máš, přímo v HTML. nový Wikan 15.11.2015 19:12	Wikan	15.11.2015 19:12
Aha no tak teď už to funguje. Ale jde nějak uplně přesně určit že se jedná o mobil, bez toho zjišťov… nový _Tomáš__ 15.11.2015 19:24	_Tomáš__	15.11.2015 19:24
Protože třeba konkrétně můj mobil má HD rozlišení a to už se plete i do stolních počítačů. nový _Tomáš__ 15.11.2015 19:26	_Tomáš__	15.11.2015 19:26
Zcela spolehlivě nijak. Většinou se to dá odhadnout z userAgent, ale není to stoprocentní. nový Wikan 15.11.2015 19:28	Wikan	15.11.2015 19:28
A nebo mě teď napadlo, že by se provedla podmínka co by zjistila o jaké zařízení jde a podle toho na… nový _Tomáš__ 15.11.2015 19:31	_Tomáš__	15.11.2015 19:31
No však, třeba podle toho userAgent. nový Wikan 15.11.2015 19:33	Wikan	15.11.2015 19:33
Takže bych měl použít tohle? <script> var txt = "";txt += "<p>Platform: " + navigator.platform + "<… nový _Tomáš__ 15.11.2015 19:36	_Tomáš__	15.11.2015 19:36
Psal jsem snad userAgent a ne platform. nový Wikan 15.11.2015 19:41	Wikan	15.11.2015 19:41
<script> function myFunction() { var x = "User-agent header sent: " + navigator.userAgent; document.… nový _Tomáš__ 15.11.2015 19:43	_Tomáš__	15.11.2015 19:43
Ale jak to mám teď poupravit aby mi to fungovalo tak jak chci? Chápu že to posílá ty údaje do "demo"… nový _Tomáš__ 15.11.2015 19:46	_Tomáš__	15.11.2015 19:46
Pokud to běží na Androidu, obvykle tam bude text Android. Pokud na iPhonu, tak tam obvykle bude text… nový Wikan 15.11.2015 19:48	Wikan	15.11.2015 19:48
Podrobně to bude jako bez té závozky a vyleze z toho jenom Android, nebo Iphone nebo to akorát bude… nový _Tomáš__ 15.11.2015 19:51	_Tomáš__	15.11.2015 19:51
Třeba tak: http://stackoverflow.com/questions/11381673/detect ing-a-mobile-browser nový Wikan 15.11.2015 19:53	Wikan	15.11.2015 19:53
Viděl bych to asi na tohle function detectmob() { if( navigator.userAgent.match(/Android/i) \|\| navi… nový _Tomáš__ 15.11.2015 20:09	_Tomáš__	15.11.2015 20:09
K výsledku je možné sa dopracovať viacerými spôsobmi. Použi to, čo Ti vyhovuje a hlavne funguje... nový pme 15.11.2015 20:16	pme	15.11.2015 20:16
Ještě jedna taková otázka. K tomu co sem tady postnul ten kód, budu potřebovat PHP? Nebo to budou je… nový _Tomáš__ 15.11.2015 20:27	_Tomáš__	15.11.2015 20:27
Je to jenom JS. nový Wikan 15.11.2015 20:29	Wikan	15.11.2015 20:29
To má být celá ta podmínka i s tím co to má potom udělat atd v jednom těle SCRIPT? nový _Tomáš__ 15.11.2015 20:53	_Tomáš__	15.11.2015 20:53
mám to dobře zapsané? <script> function detectmob() { if( navigator.userAgent.match(/Android/i) \|\|… nový _Tomáš__ 15.11.2015 21:04	_Tomáš__	15.11.2015 21:04
A tu funkci někde voláš? nový Wikan 15.11.2015 21:18	Wikan	15.11.2015 21:18
Jo <body onload="detectmob()"> Ale jde to zavolat i dříve? nový _Tomáš__ 15.11.2015 21:18	_Tomáš__	15.11.2015 21:18
Nojo jenomže teď mi to tu stránku obnovuje pokaždé co sjedu dolů. nový _Tomáš__ 15.11.2015 21:25	_Tomáš__	15.11.2015 21:25
<script> (function detectmob() { if(navigator.userAgent.match(/Android/i) \|\| navigator.userAgent.mat… nový Wikan 15.11.2015 21:29	Wikan	15.11.2015 21:29
Tak teď se to zblblo uplně. Ta stránka se načíta tak 10 krát za sekundu. nový _Tomáš__ 15.11.2015 21:35	_Tomáš__	15.11.2015 21:35
No ještě by to chtělo kontrolovat, jestli to na té stránce už náhodnou není a pak teprv přesměrováva… nový Wikan 15.11.2015 21:38	Wikan	15.11.2015 21:38
Ale jak? Jestli se ti chce tak mi to můžeš napsat, jinak se zkusím dopatrat zítra :) nový Tomy158 15.11.2015 22:00	Tomy158	15.11.2015 22:00
(function detectmob() { var hostname; if(navigator.userAgent.match(/Android/i) \|\| navigator.userAgen… nový Wikan 15.11.2015 22:19	Wikan	15.11.2015 22:19
Když se teď tak dívám, tak ono by tam ta podmínka u toho else vlastně vůbec nemusela být. Tam napíšu… nový Tomy158 16.11.2015 09:37	Tomy158	16.11.2015 09:37
To už záleží na tobě. nový Wikan 16.11.2015 10:39	Wikan	16.11.2015 10:39
Tak teď mi to funguje jak chci. Teď bych ještě potřeboval poradit jak mám udělat ty stránky na mobil… nový _Tomáš__ 16.11.2015 19:13	_Tomáš__	16.11.2015 19:13
Novou doménu si kupovat nemusíš, stačí si vytvořit novou doménu třetího řádu. Jak se to dělá, záleží… nový Wikan 16.11.2015 19:33	Wikan	16.11.2015 19:33
main.php nový Kréťa 16.11.2015 19:47	Kréťa	16.11.2015 19:47
Koukám, že nedokážeš udržet stejné jméno. Tak kontaktuj podporu toho hostingu a zeptej se na možnost… nový Wikan 16.11.2015 19:49	Wikan	16.11.2015 19:49
To byl omyl :D Jo díky za radu :) poslední _Tomáš__ 16.11.2015 19:50	_Tomáš__	16.11.2015 19:50

Vyhledat 'css media queries"

To je "@media"? S tím sem dělal to rozlišení a nefungovalo mi to

Tak to jsi to asi dělal špatně.

Normálne do určitého rozlišení to funguje...ale od menšího rozlišení to nic nedělá a když to zmenším do určité hranice tak to místo obrázku na pozadí udělá to pozadí světle zelené a vůbec nevím jak a proč.

To my taky ne, když neznáme tvé stránky.

Pošli sem kod, nebo ještě líp sem : diskuse.jakpsatweb.cz

Momentálně nemám k dispozici pc. Postačí ti odkaz na stránku? www.sdhbecva.cz

background-color: lightgreen;

Ale vždyť to tam nemám. Já potřebuju aby to pozadí mělo barvu #696969

@media (min-width:1px) and (min-height:1px) and (max-width:540px) and (max-height:960px){
	body{
		background-color:#696969;
		background-image: none;
	  }
  }

Ale máš, přímo v HTML.

Aha no tak teď už to funguje. Ale jde nějak uplně přesně určit že se jedná o mobil, bez toho zjišťování rozlišení?

Protože třeba konkrétně můj mobil má HD rozlišení a to už se plete i do stolních počítačů.

Zcela spolehlivě nijak. Většinou se to dá odhadnout z userAgent, ale není to stoprocentní.

A nebo mě teď napadlo, že by se provedla podmínka co by zjistila o jaké zařízení jde a podle toho načetla zadanou stránku. Byla by trošku odlišná od té normální.

No však, třeba podle toho userAgent.

Takže bych měl použít tohle?

<script>
var txt = "";txt += "<p>Platform: " + navigator.platform + "</p>";</script>

Psal jsem snad userAgent a ne platform.

<script>
function myFunction() {
    var x = "User-agent header sent: " + navigator.userAgent;
    document.getElementById("demo").innerHTML = x;
}
</script>

Ale jak to mám teď poupravit aby mi to fungovalo tak jak chci? Chápu že to posílá ty údaje do "demo". Ale z toho vyleze dlouhý řádek a těch kombinací může být spousta. Tam je důlžité to Windows NT 10.0 nebo jak to tam bylo ne?

Pokud to běží na Androidu, obvykle tam bude text Android. Pokud na iPhonu, tak tam obvykle bude text iPhone atd.

Podrobně to bude jako bez té závozky a vyleze z toho jenom Android, nebo Iphone nebo to akorát bude místo toho Windows v té zavorce. Jestli to bude v té závorce tak jak to z toho mám dostat?

Třeba tak:
http://stackoverflow.com/questions/11381673/detect ing-a-mobile-browser

Viděl bych to asi na tohle

function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}

K výsledku je možné sa dopracovať viacerými spôsobmi. Použi to, čo Ti vyhovuje a hlavne funguje...

Ještě jedna taková otázka. K tomu co sem tady postnul ten kód, budu potřebovat PHP? Nebo to budou jenom normální podmínky, scripty.

Je to jenom JS.

To má být celá ta podmínka i s tím co to má potom udělat atd v jednom těle SCRIPT?

mám to dobře zapsané?

<script>
	function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
	window.location.href="http://m.sdhbecva.cz/index.html";
	}
 else {
    window.location.href="http://sdhbecva.cz/index.html";
  }
}
	</script>

A tu funkci někde voláš?

<body onload="detectmob()">

Ale jde to zavolat i dříve?

Nojo jenomže teď mi to tu stránku obnovuje pokaždé co sjedu dolů.

<script>
(function detectmob() { 
    if(navigator.userAgent.match(/Android/i)
       || navigator.userAgent.match(/webOS/i)
       || navigator.userAgent.match(/iPhone/i)
       || navigator.userAgent.match(/iPad/i)
       || navigator.userAgent.match(/iPod/i)
       || navigator.userAgent.match(/BlackBerry/i)
       || navigator.userAgent.match(/Windows Phone/i)
    ) {
        window.location.href="http://m.sdhbecva.cz/index.html";
    }
    else {
        window.location.href="http://sdhbecva.cz/index.html";
    }
})()
</script>

Tak teď se to zblblo uplně. Ta stránka se načíta tak 10 krát za sekundu.

No ještě by to chtělo kontrolovat, jestli to na té stránce už náhodnou není a pak teprv přesměrovávat.

Ale jak? Jestli se ti chce tak mi to můžeš napsat, jinak se zkusím dopatrat zítra :)

(function detectmob() { 
    var hostname;
    if(navigator.userAgent.match(/Android/i)
       || navigator.userAgent.match(/webOS/i)
       || navigator.userAgent.match(/iPhone/i)
       || navigator.userAgent.match(/iPad/i)
       || navigator.userAgent.match(/iPod/i)
       || navigator.userAgent.match(/BlackBerry/i)
       || navigator.userAgent.match(/Windows Phone/i)
    ) {
        hostname="m.sdhbecva.cz";
    }
    else {
        hostname="sdhbecva.cz";
    } console.log(hostname);
    if (window.location.hostname !== hostname) {
        window.location.href = "http://" + hostname;
    } console.log(window.location.href);
})()

Když se teď tak dívám, tak ono by tam ta podmínka u toho else vlastně vůbec nemusela být. Tam napíšu "Return" ne?

To už záleží na tobě.

Tak teď mi to funguje jak chci. Teď bych ještě potřeboval poradit jak mám udělat ty stránky na mobil. Obecně co tam vidívám se používá to www.m.sdhbecva.cz. Ale na to si musím koupit novou Doménu nebo je to jenom nějaká ta jinačí třída? V tomhle se nějak nevyznám.

Novou doménu si kupovat nemusíš, stačí si vytvořit novou doménu třetího řádu. Jak se to dělá, záleží na tvém hostingu.

main.php

Koukám, že nedokážeš udržet stejné jméno. Tak kontaktuj podporu toho hostingu a zeptej se na možnosti.

To byl omyl :D Jo díky za radu :)

Zpět do poradny Odpovědět na původní otázku Nahoru