Har sökt lite varstans men inte riktigt tråden som hjälper mig att klura ut detta.
Säg att jag har en bild typ /förklaring
under finns det länkar som tas från en databas typ
länk1 laddar bild 1 samt text vid mouseover
länk2 laddar bild 2 samt text vid mouseover
länk3 laddar bild 3 samt text vid mouseover
osv..
Men att sedan kunna få ut en tillhörande text under bilden samt att vid byte kunna fade in och fade ut innan nästa bild laddas. (vill alltså ersätta bilden "förklaring" med länk bilden). Önskan är sedan att om man trycker på länken, så "fryser" bilden.
Detta är lite över mitt kunnade och jag behöver därför hjälp med tankar kring lösningen samt ev. länktips m.m.
För att ge en ett exempel på kod så är väl grunden något åt samma håll som nedanstående.
<script type="text/javascript">
/* Detta script finns att hämta på [url]http://www.jojoxx.net[/url] och
får användas fritt så länge som dessa rader står kvar. */
if (document.images) {
button_1_off=new Image;
button_1_off.src="images/empty.gif";
button_1_red=new Image;
button_1_red.src="images/red.gif";
button_1_green=new Image;
button_1_green.src="images/green.gif";
button_1_blue=new Image;
button_1_blue.src="images/blue.gif";
}
function rollIn(imgName, state) {
if (document.images) {
document[imgName].src=eval(imgName + state + ".src");
}
}
function rollOut(imgName) {
if (document.images) {
document[imgName].src=eval(imgName + "off.src");
}
}
</script>
<table border=0>
<tr>
<td align=center width="80"><a href="imageswap3.html" onMouseover="rollIn('button_1_', 'red')" onMouseout="rollOut('button_1_')">Röd</a></td>
<td align=center width="80"><a href="imageswap3.html" onMouseover="rollIn('button_1_', 'green')" onMouseout="rollOut('button_1_')">Grön</a></td>
<td align=center width="80"><a href="imageswap3.html" onMouseover="rollIn('button_1_', 'blue')" onMouseout="rollOut('button_1_')">Blå</a></td>
</tr>
<tr><td> </td><td align=center><img src="images/empty.gif" border=0 name="button_1_" alt="Imageswap" width=50 height=30></td><td> </td></tr>
</table>