| Grafik | |
| Text | |
Ett betydligt enklare sätt som passar bra för *små* bildbyten är att koda det direkt i a href-taggen (länken).
Vad som avses med små är att bilderna är så små i filstorlek att bilden med pilen i exemplet inte tar någon tid alls att ladda in, vilket ju sker först när man för musen över den genomskinliga bilden.
Här är startbilden en genomskinlig gif:
<img src="clear.gif" width="14" height="13" name="bild1" alt="Grafik" border="0">
Du måste namnge varje bild med ett unikt namn, här har jag kallat dem bild1 respektive bild2. Tänk på att de ska vara lika stora för bästa resultat.
Sedan sker ombytet via länken som nedan, glöm ett infoga det namn du gett bilden:
<a href="fil.html"
onmouseover="document.bild1.src='a1.gif'; return true"
onmouseout="document.bild1.src='clear.gif'; return true">Länktext</a>
Koden ihop blir:
<p><a href="fil.html"
onmouseover="document.bild1.src='a1.gif'; return true"
onmouseout="document.bild1.src='clear.gif'; return true">Länktext</a>
<img src="clear.gif" width="14" height="13" name="bild1" alt="Grafik" border="0">
<p><a href="fil.html"
onmouseover="document.bild2.src='a1.gif'; return true"
onmouseout="document.bild2.src='clear.gif'; return true">Länktext</a>
<img src="clear.gif" width="14" height="13" name="bild2" alt="Grafik" border="0">