twee onclick-events combineren?

Status
Niet open voor verdere reacties.

Jan92

Gebruiker
Lid geworden
17 feb 2010
Berichten
111
Beste specialisten,

Ik heb een eenvoudige pagina aangemaakt met een tabel (prijslijst).
In de tweede kolom zet ik naast het artikel (kolom 1) een kleine afbeelding die als link werkt voor een popup.
Als de gebruiker dus op deze afbeelding klikt komt er een kleinere "detail" pagina tevoorschijn.
Het probleem waar ik nu mee worstel is, dat ik dan ook deze kleine afbeelding wil vervangen door een andere
zodat men kan zien dat deze link reeds werd aangeklikt.
Bij de "onclick" moeten er dus twee dingen bebeuren, 1. De afbeelding vervangen en 2. De popup tonen.
Ik geraak er gewoon niet aan uit "hoe" deze in mijn code te combineren.

m.v.g., Jan

Code:
<HTLM>

<head>

<!-- COMMENT : Background color (Sienna) -->
<BODY BGCOLOR="A0522D ">

<!-- COMMENT : Titel invoegen -->
<center><h1><font color="white">Prijslijst</FONT></h1><center>

<!-- COMMENT : Gekleurd balkje invoegen -->
<hr width="50%" size="10" color="red" noshade align="center">

<!-- COMMENT : Tabel (Prijslijst) -->
<div align="center">
<table border=1 width=500 style="background-color:lightyellow">
<tr>
<th><div align="left">&nbsp; &nbsp;A R T I K E L 's</th>
<th>Detail</th>
<th><div align="right">Prijs</th>
</tr>


<!-- COMMENT : POP_UP met afbeelding i.p.v. nieuwe pagina in brownser ! -->
<tr>
<td>&nbsp; &nbsp;Artikel 001</td>
<td><div align="center"><a onclick="popupCenter('Foto-Artikel-001.jpg', 'myPop1',500,400);
" href="javascript:void(0);"><img src="web-images/Icon-Eye-Green.gif"</a>
<td height="30"><p align="right">€ 00,00</td>
</tr>

<!-- COMMENT : POP_UP met afbeelding i.p.v. nieuwe pagina in brownser ! -->
<tr>
<td>&nbsp; &nbsp;Artikel 002</td>
<td><div align="center"><a onclick="popupCenter('Foto-Artikel-002.jpg', 'myPop1',500,400);
" href="javascript:void(0);"><img src="web-images/Icon-Eye-Green.gif"</a>
<td height="30"><p align="right">€ 00,00</td>
</tr>

<!-- COMMENT : POP_UP met afbeelding i.p.v. nieuwe pagina in brownser ! -->
<tr>
<td>&nbsp; &nbsp;Artikel 003</td>
<td><div align="center"><a onclick="popupCenter('Foto-Artikel-003.jpg', 'myPop1',500,400);
" href="javascript:void(0);"><img src="web-images/Icon-Eye-Green.gif"</a>
<td height="30"><p align="right">€ 00,00</td>
</tr>

</table>
</div>


<!-- COMMENT : Detail-afbeelding wijzigen van groen naar rood bij onclick -->

<!-- COMMENT : Onderstaande code werkt, maar HOE deze te combineren met de "popupCenter" ? ? -->

<p align="center">
<img src="web-images/Icon-Eye-Green.gif" name="pic" onclick="window.document.pic.src='web-images/Icon-Eye-Red.gif';"/>
</p>


</body>

</HTLM>
 
twee onclick-events combineren = opgelost!

Hoera ! Ik heb het na enkele uren zoeken en studeren zelf gevonden !

Voor wie het zou interesseren, hierbij de oplossing :

Code:
<!-- Onderstaande regel : -->

<td><div align="center"><a onclick="popupCenter('Foto-Artikel-001.jpg', 'myPop1',500,400);
" href="javascript:void(0);"><img src="web-images/Icon-Eye-Green.gif"</a>

<!-- vervangen door : (onderlijnde code is bijgezet ) -->

<td><div align="center"><a onclick="popupCenter('Foto-Artikel-001.jpg', 'myPop1',500,400);
" href="javascript:void(0);"><img src="web-images/Icon-Eye-Green.gif" [U]onclick="this.src='web-images/Icon-Eye-Red.gif'" />[/U]</a>

mvg, Jan :thumb:
 
Status
Niet open voor verdere reacties.

Nieuwste berichten

Terug
Bovenaan Onderaan