Vaihtuvat kuvat

Esimerkin tällaista mun tekemänä voi bongata esim. tämän blogin sivupalkista.

Ohjeet on nopeesti tehty ja epäselvät mutta koittakaa pärjätä :-D!
Lisää voi aina kysyä jos joku kohta jää tosiaan epäselväksi.

1. Ensin tarviit tietysti ne kuvat jotka haluat siihen, yhden hiiren ollessa kuvan päällä ja toisen kun hiiri on muualla. Kuvien ois hyvä olla suunnilleen samankokoisia. Lataa nää kuvat esim. Photobucketiin (paras vaihtoehto).

2. Sitten tarvitaan itse se muokattava koodi, joka on:
<a href="LINKINKOHDE"><img src="EKAKUVANURL" onmouseover="this.src='TOKAKUVANURL'" onmouseout="this.src='EKAKUVANURL'" /></a>  

3. Avaa esim. Word ja kopioi+liitä tuo koodi sinne.

4. Mene photobucketiin, avaa haluamasi kuva 1 (siis kuva joka näkyy kun hiiri ei ole kuvan päällä) ja oikeella puolella sivua pitäis olla "Links to share this photo"-laatikko. Kopioi koko homma Direct-kohdasta.

5. Mene Wordiin ja liitä koko äsken kopioimasi homma EKAKUVANURL-tekstin tilalle. Poista siis toi teksti siitä alta, mutta jätä kaikki "'-yms. paikoilleen. (Huom. ekakuvanurl-kohtia on kaksi, laita se siis molempiin.)

6. Tee sama toiselle kuvalle, sen laitat TOKAKUVANURL-kohtaan vaan.

7. LINKINKOHDE-kohtaan voit laittaa jonkun sivun jos haluat kuvan klikkaamisen johtamisen johtavan johonkin. Linkki tulee ihan normimuodossa, eli esim http://wilmv.blogspot.fi
Jos et halua sen johtavan mihinkään sen erikoisemmille sivuille (esim. About me-sivu, instagram, whatever..) niin laita kohtaan vaan sun blogin osoite. Tällöin klikkaaminen johtaa siis vaan oman blogisi etusivulle.

8. Seuraavaksi mennään takas Bloggeriin, ja Ulkoasu-kohtaan. Sitten valitse Lisää Gadget, ja siitä avautuvasta valikosta HTML/JavaScript.

9. Laita Sisältö-kohtaan Wordista se koko koodijuttu.

10. Tallenna ja nyt niiden pitäis näkyä blogissa! :-) Jos on tosiaan ongelmia niin kysy!