[HTML] onmouseover Tabellen - Softwareontwikkeling

woensdag 16 januari 2002 11:45

Acties:

Verwijderd

Topicstarter

Ik ben nu bezig om met css een tabel een mouseover kleur verandering te geven.

<TD BGCOLOR=#eeeeee onMouseOver="this.style.backgroundColor='#ffffff';" onMouseOut="this.style.backgroundColor='#eeeeee'">

Dit is me nu gelukt, wat ik echter wil bereiken is dat meedere cells in de table tegelijk diezelfde kleur geven bij mouseover, dus dat als je over 1 gaat, 2 ook op ligt, ga je over 2 dat dan ook 1 op ligt (zie hieronder)...

--------
| 1 | 2 |
|-------
| 3 | 4 |
--------

iemand een suggestie?

woensdag 16 januari 2002 11:49

Acties:

cutter

Wannabe i7 fanboy

De code in je TR tag zetten. Dus:

code:

<table cellspacing="2" cellpadding="2" border="0">
<TR BGCOLOR=#eeeeee onMouseOver="this.style.backgroundColor='#ffffff';" onMouseOut="this.style.backgroundColor='#eeeeee'">


    <td>blaat</td>
    <td>blaat</td>
</tr>
<tr>
    <td>blaat</td>
    <td>blaat</td>
</tr>
</table>

woensdag 16 januari 2002 11:50

Acties:

Pelle

🚴‍♂️

Op woensdag 16 januari 2002 11:45 schreef Bouka het volgende:
iemand een suggestie?

Ja. Id roelt.

code:

1	onMouseOver="document.getElementById("idVanAndereCel").style.backgroundColor='#ffff00';"

woensdag 16 januari 2002 11:51

Acties:

Verwijderd

Topicstarter

helemaal top!

vrijdag 23 augustus 2002 23:37

Acties:

Verwijderd

heeft iemand een suggestie voor dit?

code:

1	document.write(' <tr BGCOLOR=#eeeeee onMouseOver="this.style.backgroundColor=\'#ffffff\'" onMouseOut="this.style.backgroundColor=\'#eeeeee\'">');

of dit?

code:

1 2	var bla = ' onMouseOver="this.style.backgroundColor = \'#ff7200\'" onMouseOut="this.style.backgroundColor = \'#FFFFFF\'"'; // <td ' + bla + '>');

wat op een of andere manier werkt dit dus niet...

zie code

http://cc34481-b.groni1.gr.nl.home.com/flexgrid.html

[ Voor 0% gewijzigd door Verwijderd op 23-08-2002 23:41 . Reden: 2e code verkeerd + voorbeeld added! ]

zaterdag 24 augustus 2002 08:39

Acties:

Verwijderd

ik ben er nu al de hele ochtend mee bezig maar komt er nog steeds niet uit...

mischien dat het aan dit kan liggen (dat de mouseover niet werkt)
divs?
of dat ik ook al een style gebruik voor de tr's?

zaterdag 24 augustus 2002 16:11

Acties:

Grom

lief hè!

xtentic:

Dit werkt in de moderne browsers (DOM):
Toevoegen bij de scripts:

code:

function makeMouseOver(){
    if (document.getElementById){
        var x = document.getElementById('contentarea').getElementsByTagName('TR'); 
    for (var i=0;i&lt;x.length;i++){
          x[i].onmouseover = function () {this.style.backgroundColor='#8080ff'}
          x[i].onmouseout = function () {this.style.backgroundColor='#ffffff'}
        }
    }
}

maak van body tag:<body onload="makeMouseOver()">
dat var bla=... gedoe er uit.

zaterdag 24 augustus 2002 16:33

Acties:

Galoptic

Kijk ook 's hier... Vervang "this" door het ID van de cel die veranderen moet. Succes!

zondag 25 augustus 2002 15:37

Acties:

Verwijderd

Wat je zou kunnen doen is:

Geeft iedere cel een naam dus en een mouseover <td name="cel1" onmouseover="doeCellFX('cel1');">BlaBla</td>

Daarna voeg je een script boven in de site like:

<script language="JavaScript">
doeCellFX(var) {

//Scheiden verschillende cellen

if(var == "cel1") {
cel1.bgcolor="#213222"; //of bgcolor is week niet zeker, maar zoeits is het!
cel2.bgcolor="#213222";
}

//enz enz

}

Met deze functie kun je dus zorgen dat er enkele cellen appart mee bewegen. De if statements kunnen eventueel ook in een SWITCH opgenomen worden!