Prilagajanje css resoluciji zaslona

9 naročnikov

hej

uporabljam rahlo prilagoditev cssa glede na resolucijo zaslona. Tukaj je skripta, ki sem jo našel na enem forumu ko sem googlal:

<link rel="stylesheet" type="text/css" media="screen" href="majhen.css" />
<script type="text/javascript">

<!--

if (screen.width >1200)

  link = document.getElementsByTagName("link")[0];

  link.href = "velik.css";

-->

</script>

Vse štima, ko je resolucija manjša od 1200, prikaže majhen.css, ko pa je večja, pa velik.css. Kako bi sedaj dodal v to kodo, da takrat ko pa je manjša od 1200 in večja od 1000 pa prikaže srednji.css ?

hvala za pomoč

if (screen.width < 1200 && screen.width > 1000)?

A ni bol enostavno naredit dinamični css? width:90%... =)

div z %, fonte z em. Ampak moraš biti previden pri uporabi bacground slik.

... in pri marginih in paddingih v px. Ampak se da vse resiti.

moje mnenje, da če delaš prilagodljiv dizajn, moraš povsod uporabljat % oz em, tudi pri margin in padding. namreč če imaš vedno padding recimo 10px, potem je pri 1900px širine to bore malo oz skoraj nič, pri 1024px pa mogoče ravno prav ali preveč.
Če delaš s % je potrebno vse dat v %, drugače nima smisla. Moje mnenje.

Človek sploh ni povedal zakaj točen rabi velikost uproabnikovega zaslona...

Jaz imam naprimerm ne eni strani fixen width in fixen height, ampak spreminjam velikost background slike glede na velikost zaslona. Ne moreš nekomu, ki ima zaslon 800x600 (mal pretiravam) podturit background sliko 1680x1050.

Edit: Marek hvala, uganil si zakaj to potrebujem :D

tole rabim za prilagajanje slike. Ko bo ena resolucija, bo prikazalo div ki ima v ozadju eno sliko, ko bo večja resolucija pa div ki ima v ozadju večjo sliko

janck hvala! A mi lahko prosim še kdo pomaga sedaj to skupaj spravit?

Sem probal tole pa ne gre:

<link rel="stylesheet" type="text/css" media="screen" href="majhen.css" />
<script type="text/javascript">

<!--

if (screen.width >1150)

  link = document.getElementsByTagName("link")[0];

  link.href = "velik.css";

else if (screen.width < 1150 && screen.width > 850)

  link = document.getElementsByTagName("link")[0];

  link.href = "srednje.css";

-->

</script>

Torej, rad bi da prikaže ko je manjše od 850 majhen.css, ko je med 850 in 1150 srednje.css in ko je večje od 1150 velik.css

Sory da težim ampak nimam pojma o javi in bi prosil še za malo pomoči

Najlepša hvala že vnaprej

Torej ti manjka se en elsi if (screen.width < 850)

Pa to je Javascript, ne mesat z Javo!

ok hvala, ne bom več mešal

ampak še zmeraj ne deluje. Ves čas mi prikazuje majhen.css, kot da javascript sploh ne bi deloval...

Tule pa je še koda kako sem sedaj nardil po tvojem navodilu perunpro

<link rel="stylesheet" type="text/css" media="screen" href="majhen.css" />
<script type="text/javascript">

<!--

if (screen.width >1150)

  link = document.getElementsByTagName("link")[0];

  link.href = "velik.css";

else if (screen.width < 1150 && screen.width > 850)

  link = document.getElementsByTagName("link")[0];

  link.href = "srednje.css";

else if (screen.width <850)

  link = document.getElementsByTagName("link")[0];

  link.href = "majhen.css";

-->

</script>

Tag name - imas sploh povezave narejene z LINKOM ali uporabljas A?

Boljsa metoda je
getElementById("MyID") in das nek ID na ustrezne povezave