Predložak:Skaliranje slike

Izvor: Wikipedija
Prijeđi na navigaciju Prijeđi na pretraživanje

Uvod[uredi]

Na Wikipediji se obeshrabruje korišćenje apsolutnih jedinica za veličinu slika. Međutim, u Mediawiki softveru parametar za veličinu slike može se iskazati samo apsolutnom jedinicom px, na primjer [[Datoteka:primjer.jpg|220px]], sve ostale jedinice nemaju nikakav učinak.

Među relativnim jedinicama nalaze se i jedinice vw, vh, vmin i vmax koje predstavljaju 1 % širine ili visine viewporta.

Predložak skalira (odnosno povećava ili smanjuje) sliku prema širini viewporta rabeći jedinicu vw.

Uporaba[uredi]

{{skaliranje slike|slika|veličina|ravnanje}}

Parametri su neimenovani, što znači da se navodi samo vrijednost.

  • slika - navodi se samo ime, bez datoteka:, npr. primjer.jpg. Ovaj parametar mora se navesti.
  • veličina - je postotak (broj jedinica vw), navodi se samo broj, koji može biti i decimalni, ali s decimalnom točkom umjesto zareza, npr. 34.5 (iako za tim nema realne potrebe, jednostavno treba odbaciti decimalni dio). Ako je broj negativan, slika će biti u punoj širini. Ako se parametar izostavi (vidjeti napomenu), podrazumijevana veličina je 50 %, ali mu se mora zadržati pozicija, npr. {{skaliranje slike|primjer.jpg||lijevo}}. Iako u principu nema ograničenja, za najveću vrijednost pogledati donje napomene.
  • ravnanje - dopuštene vrijednosti su lijevo, sredina, desno. Ako se parametar izostavi, slika će biti na sredini (centrirana). Ako se kao parametar navede inline, slika će se prikazati u liniji teksta (pogledati primjer).

Napomene i ograničenja[uredi]

Viewport (pojednostavljeno) predstavlja širinu prozora preglednika. Stranice na Wikipediji slijeva imaju fiksni okvir (sidebar) koji je kod sučelja monobook širine 175px, a kod sučelja vector 180px. Dodatno, s obje strane "članka" su margine po 15px na sučelju monobook i po 25px na sučelju vector. Na širini prozora od 1024px (osnovna vrijednost*) "aktivna" širina je 1024px - 205px = 819px na sučelju monobook i 1024px - 230px = 794px na sučelju vector. (* Izračun se vrši na 1024px iako širina prozora može biti mnogo veća.)

  • Prema navedenom, preporučene najveće vrijednosti za skaliranje su 818 / 1024 = 0,799 tj. 79.9 na sučelju monobook i 794 / 1024 = 0,775 tj. 77.5 na sučelju vector. Veće skaliranje povećava širinu stranice (slika izlazi udesno, pa se mora skrolati).
  • Predložak ne povećava slike, odnosno ako je slika na poslužitelju mala, predložak će je prikazati do njene najveće širine. Na primjer, ako je na poslužitelju slika primjer.jpg širine 355px, {{skaliranje slike|primjer.jpg|200}} prikazat će širinu 355px, a neće je udvostručiti.
  • Ravnanje ne funkcionira kod užih slika ako je skaliranje veće od širine slike. Najveća vrijednost skaliranja može se odrediti formulom veličina / 1024, za navedeni primjer bilo bi 355 / 1024 = 0,346, odnosno {{skaliranje slike|primjer.jpg|34.6|ravnanje}}. Kao veličina za slike u SVG formatu uzima se nominalna širina.
  • Ako se predložak koristi u kontejneru (npr. <div>...</div>) mora se navesti parametar veličina, inače će slika biti širine prozora preglednika, pomaknuta udesno za širinu sidebara.

Primjeri[uredi]

Za djelovanje primjera povećajte ili smanjite širinu prozora preglednika.

Slika male širine[uredi]

Ravnanje je ispravno do granične vrijednosti (34,6 po gornjem izračunu): {{skaliranje slike|primjer.jpg|30}}

50

Odstupanje ravnanja kod prevelikog skaliranja: {{skaliranje slike|primjer.jpg|60}}

50

Ravnanje lijevo[uredi]

{{skaliranje slike|Rovinj by night.jpg|50|lijevo}}

50

Ravnanje desno[uredi]

{{skaliranje slike|Rovinj by night.jpg|50|desno}}

50

Usporedba veličine skaliranja[uredi]

{{skaliranje slike|Rovinj by night.jpg|10}}

50

{{skaliranje slike|Rovinj by night.jpg|30}}

50

{{skaliranje slike|Rovinj by night.jpg|50}}

50

{{skaliranje slike|Rovinj by night.jpg|70}}

50

Puna širina[uredi]

Puna širina dobije se ako se navede bilo koji negativan broj: {{skaliranje slike|Rovinj by night.jpg|-1}}

50

Preveliko skaliranje[uredi]

Primjer je izostavljen jer se neće rabiti u praksi, a narušio bi izgled predloška, ali ga možete probati na svojoj SZV:

  • {{skaliranje slike|Rovinj by night.jpg|100}} - slika izlazi na desno za vrijednost sidebara.

Skaliranje teksta i slike[uredi]

Parametrom inline slika se može umetnuti u red teksta. U ovom primjeru se promjenom veličine viewporta mijenjaju veličina i slike i teksta.

  • <div style="font-family:Arial; font-size: 1.3vw; ">Ova se sličica {{skaliranje slike|Hr logo c.png|2|inline}} koristi kao logo Wikipedije na hrvatskome jeziku. </div>
Ova se sličica

50

koristi kao logo Wikipedije na hrvatskome jeziku.
  • Da vidite djelovanje ovog primjera povećajte ili smanjite širinu vašeg preglednika.