 
Placera en TEXTAREA på
en FORM och namnge dem, t ex så här :
<FORM NAME = "iljtextareaform">1
<TEXTAREA NAME = "iljtextarean"2
ROWS = "8"
COLS = "30"
WRAP = "physical">
</TEXTAREA>
</FORM>
Så här kan man placera två klickbara bilder på sidan:
<A HREF = "#"
ONCLICK="iljtextval(0,0);return false">
<IMG SRC= "bildfilens namn"
WIDTH = "bildens bredd i pixel"
HEIGHT = "bildens höjd i pixel"
BORDER="0"></A>
<A HREF = "#"
ONCLICK="iljtextval(1,1);return false">
<IMG SRC= "bildfilens namn"
WIDTH = "bildens bredd i pixel"
HEIGHT = "bildens höjd i pixel"
BORDER="0"></A>
En klickning på någon av bilderna anropar alltså funktionen
iljtextval() som ser till
att text visas och bilder växlas. Siffrorna inom
parentes håller reda på VILKEN TEXT som ska visas och på
VILKEN BILDPLATS bild ska bytas
och kommer
in som textnummer resp
bildnummer i funktionen.
Först i koden finns den del som
förladdar de bilder man tänker använda,
om den webbläsare som används klarar av att byta bilder.
Så här ser koden ut:
<SCRIPT LANGUAGE="JavaScript"
TYPE="text/javascript">
<!--
if(document.images) //3
{
iljbild = new Array()
iljbild[0] = new Image()
iljbild[1] = new Image()
iljbild[0].src = "../darkred.gif"
iljbild[1].src = "../red.gif"
}
function iljtextval(textnummer,bildnummer)
{
text = new Array()
text[0] = "text 1 text"
text[1] = "text 2 text"
// etc
document.iljtextareaform1.iljtextarean2.value = text[textnummer]
if(document.images)
{
for(i=0;i<text.length;i++)//4
{
document.images[i].src=iljbild[0].src
}
document.images[bildnummer].src=iljbild[1].src//5
}
}
//-->
</SCRIPT>
1 FORMens namn; det är den här raden som placerar
text i textrutan, vilken text det blir beror av vilken siffra
man skickat med, en nolla (0) visar den text som skrivits in efter
text[0], en etta (1) den text som skrivits in efter
text[1] etc.
2 TEXTAREAns namn
3 inga bilder
byts om inte webbläsaren klarar det
4 på den här sidan finns inga
bilder före dem som ingår i exemplet; det innebär att den första
klickbara pilen är document.images[0].
Den här loopen startar alltså från 0 och ser till att
grundbilden visas på samtliga ställen och ...
5 här byts den bild man klickat på
Koden går att kopiera och klistra in.
Glöm inte att ta bort fotnoterna!
I nyare webbläsare kan man placera texten direkt på sidan med en DIV-tagg. Om man har en
DIV med ID='mydiv' placeras texten på div-ytan med följande kod:
if(document.getElementById)
{document.getElementById('mydiv').innerHTML= text[textnummer]}
mer om innerHTML
dynamisk text 1
2
Sidan gjordes av
ilj@flowsim.se
Senast ändrad 27 mars 1998.
Den här sidan hör hemma i ett ramsystem
hos:
www.flowsim.se
|
|