Så här gör du om du vill få en bild eller ikon att bytas ut till en annan när du håller muspekaren över den (mouseover).
1. Börja med att kopiera nedanstående kod och klistra in den precis innan </head> i din kodmall:
<script LANGUAGE="JavaScript">
<!--// This is the implementation of SimpleSwap// by Jehiah Czebotar// Version 1.1 - June 10, 2005// Distributed under Creative Commons//// Include this script on your page// then make image rollovers simple like:// <img src="/images/ss_img.gif" oversrc="/images/ss_img_over.gif">////function SimpleSwap(el,which){el.src=el.getAttribute(which || "origsrc");}function SimpleSwapSetup(){var x = document.getElementsByTagName("img");for (var i=0;i<x.length;i++){var oversrc = x[i].getAttribute("oversrc");if (!oversrc) continue;// preload image// comment the next two lines to disable image pre-loadingx[i].oversrc_img = new Image();x[i].oversrc_img.src=oversrc;// set event handlersx[i].onmouseover = new Function("SimpleSwap(this,'oversrc');");x[i].onmouseout = new Function("SimpleSwap(this);");// save original srcx[i].setAttribute("origsrc",x[i].src);}}var PreSimpleSwapOnload =(window.onload)? window.onload : function(){};window.onload = function(){PreSimpleSwapOnload(); SimpleSwapSetup();}//--></script>2. Spara kodmall, och gör sedan likadant i de andra tre kodmallarna. Glöm bara inte att spara kodmallen innan du byter till nästa!
3. Ladda upp bilderna du vill ha och kopiera dess bildadress!
4. Gå in i din kodmall och klista in nedanstånde där du vill placera bilden med mouseover:
<a href="ev. länkadress"><img src="adressen till bilden" oversrc="adressen till bilden som ska visas vid mouseover" border="0"></a>
Vill du ha dem i menyn klistrar du in det någonstans under <div id=”side”>
5. Spara kodmall
6. Gå nu in i den kodmall igen och klista in bildadresserna du kopierade i steg 3 i koden du precis la in.
Vill du att bilden dessurom ska vara en länk, klistrar du in adressen dit du hänvisar där det står ev. länkadress. Annars lämnar du tomt där.
7. Spara kodmall! Klart!
16 Augusti 2012 kl. 23:21
Jag fattar inte? Vart ska jag klistra in steg 4? Klistrar jag in den mitt i den "långa koden" så syns ingen bild alls, men sätter jag den mellan och så syns den första bilden men ingenting händer när jag håller musen över :0