Oppisin jotain uutta :)
Olen tähän asti ollut luulossa että kuvan osittainen näyttäminen vaatii phpGD-häkkyrää tai vastaavaa tapaa napata haluttu osa siitä kuvasta varsinkin jos haluaa myös muuttaa sen kokoa.
Eheps.
Homma onnistuu myös pelkällä CSS:llä.
Ja se toimii kaikissa selaimissa.
Itse häkkyrä on jokseenkin sekava mutta muutaman trial-errorin jälkeen alkaa pääsemään jyvälle.
- Laita kuva sivulle ja aseta sille class-nimi, tässä esimerkissä "tiekamera" sekä paketoi hienous vaikka diviin jossa style position:relative
<div style="position:relative;">
<img class="tiekamera" src="kuva.jog" alt="joku hyvä Googleruoka tähän"/>
</div>
- Tee kuavlle CSS:ään tiedot
.tiekamera
{
width:420px;
height:345px;
position:absolute;
clip:rect(10px,410px,330px,15px);
}
Otetaanpa tuo tarkempaan syyniin:
width:420px; ---> haluttu leveys + mahdollinen vasen piiloosa
height:345px; ---> haluttu korkeus + mahdollinen ylä piiloosa
clip:rect(10px,410px,330px,15px) --->
10px - yläpiiloosa
410px - haluttu leveys
330px - haluttu korkeus
15px - vasen piiloosa
Ihmellystä voi ihmetellä livenä nordicweatherin etusivun ja webkamerasivun tiekameroissa jossa laitojen mustat raidut on piilotettu :)