"Nikolaj Rasmussen" <tro@paa.det> skrev i en meddelelse
news:3db69f4e$0$10687$4d4eb98e@news.dk.uu.net...
> Hallo, jeg har sq et lille åndsvagt problem.
>
> Det er at jeg vil undgå at få en onmouseout fra en table, hvis jeg kun går
> fra cell til cell i selve tabellen.
> Jeg syntes jeg har prøvet alt, prøvet at sætte event på et span-tag uden
om
> det hele og også prøvet
> at påsætte en tabel uden om det hele med event'et.
> Men alligevel "fejler" det :(
>
> Jeg tænkte lidt på om jeg gad at have en timeOut til at fake at jeg stadig
> er i tabellen,
> men syntes også at det ville være at skyde høns med mellemstore
jet-jagere.
>
>
> mvh
> Nikolaj Rasmussen
>
>
>
> <script language=javaScript>
> function changeColor(aThis)
> {
> if (aThis.style.backgroundColor=='#ff0000')
> aThis.style.backgroundColor='#00FF00';
> else if (aThis.style.backgroundColor=='#00ff00')
> aThis.style.backgroundColor='#0000FF';
> else aThis.style.backgroundColor='#FF0000';
> }
> </script>
>
> <body>
>
> <span id="ost">
> <table onmouseout="changeColor(this)">
> <tr>
> <td>
> <table border="1" width="100%" cellspacing=0 cellpadding=0>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> <tr>
> <td width="16%"> </td>
> <td width="16%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> <td width="17%"> </td>
> </tr>
> </table>
> </td>
> </tr>
> </span>
>
>
>
>
>
Hej Nikolaj
Der er flere problemer ved den løsning du ønsker. Dit problem opstår fordi
at hver gang der sker en onmouseout event for dine tabelceller, så bobler
dette event hele vejen op til din onmouseout event handler i tabel tagget.
Løsningen ville umiddelbart være at fange onmouseout eventen når de kommer
fra en tabel celle eller en tabel række, ved at sætte
onmouseout="event.cancelBubble=true;", så du fik noget i stil med :
<table align="center" onmouseout="changeColor(this);">
<tr onmouseout="event.cancelBubble=true;">
<td>
<table border="1" width="100%" cellspacing=0 cellpadding=0>
<tr>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
</tr>
<tr>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
<td width="16%"> </td>
</tr>
</table>
</td>
</tr>
</table>
Dette sikre nu at der kun sker onmouseout event når det er den yderste tabel
der kaster den, da den øverste række fanger alle andre outmouseout events og
aflyser dem.
Problemet er nu at når man bevæger musen fra den yderste tabel ind over den
inderste tabel, så bliver der kastet en onmouseout event event fra den
yderste tabel, hvilket betyder at tabellen skifter farve, når man bevæger
musen ind over tabellen.
Jeg har ikke lige kunne finde en god løsning på dette problem, men måske kan
man udnytte noget logik der siger at når man bevæger sig ud af tabellen, så
vil der først være en onmouseout fra en celle, derefter en række og sidst en
tabel. Hvis man derimod bevæger sig ind i tabellen er sekvensen omvendt da
der først sker en onmouseout fra en tabel, derefter en række og sidst fra en
celle. Denne løsning har dog nogle problemer, da det ikke altid kan
garanteres at alle events bliver kastet.
Håber at du kan bruge det til noget.
Venlig Hilsen
Jacob Winther
IT-C
PS: Fandt en letlæselig artikel på nettet der omhandler lidt mere avancerede
event handeling
http://www.webdevelopersjournal.com/articles/jsevents1/jsevents1.html
---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (
http://www.grisoft.com).
Version: 6.0.404 / Virus Database: 228 - Release Date: 16-10-2002