/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
OnMouseout fra en tabel er dum :(
Fra : Nikolaj Rasmussen


Dato : 23-10-02 14:09

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%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
<td width="17%">&nbsp;</td>
</tr>
</table>
</td>
</tr>
</span>






 
 
Jacob Winther (24-10-2002)
Kommentar
Fra : Jacob Winther


Dato : 24-10-02 11:14

"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%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> </tr>
> <tr>
> <td width="16%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> </tr>
> <tr>
> <td width="16%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> </tr>
> <tr>
> <td width="16%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> </tr>
> <tr>
> <td width="16%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> </tr>
> <tr>
> <td width="16%">&nbsp;</td>
> <td width="16%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</td>
> <td width="17%">&nbsp;</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%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
</tr>
<tr>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</td>
<td width="16%">&nbsp;</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



Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste