Toon posts:

[JS] onmouseover change backgroundcolor TR

Pagina: 1
Acties:
  • 112 views sinds 30-01-2008
  • Reageer

zondag 9 september 2001 23:13

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Ik hoop dat het onderwerp het doel van de topic aangeeft..

Ik wil dus een JS hebben die de achtergrond kleur verandert van een tablerow wanneer je er met je muis over gaat...Dit is waar ik tot nu toe ben gekomen
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

<html>
<head>
    <title>
      Untitled
    </title>
    <SCRIPT LANGUAGE="javascript">
<!--

function redon(fArg)
{
    var tooltipOBJ = eval("document.all['tt" + fArg + "']");tooltipOBJ.style.color = "red";
}

function redoff(fArg)
{
    var tooltipOBJ = eval("document.all['tt" + fArg + "']");tooltipOBJ.style.color = "black";
}

// -->
</SCRIPT>
<STYLE TYPE="text/css">
<!--
.reminderTooltip {
    
    visibility:visible;
    font: arial,sans-serif,;
    
}
-->
</STYLE>
</head>
   <body>
       <table border="1">
           <tr ID=tt1 onmouseover="redon(1);" onmouseout="redoff(1);"><td>Test1</td></tr>
           <tr ID=tt2 onmouseover="redon(2);" onmouseout="redoff(2);"><td>Test2</td></tr>
           <tr ID=tt3 onmouseover="redon(3);" onmouseout="redoff(3);"><td>Test3</td></tr>
           <tr ID=tt4 onmouseover="redon(4);" onmouseout="redoff(4);"><td>Test4</td></tr>
       </table>
   </body>
</html>

de reden dat daar nu:
var tooltipOBJ = eval("document.all['tt" + fArg + "']");tooltipOBJ.style.color = "black";
staat is omdat hij het met
var tooltipOBJ = eval("document.all['tt" + fArg + "']");tooltipOBJ.style.background-color = "black";
niet doet...Syntax errors enzo.

Heeft iemand hier een oplossing voor?

zondag 9 september 2001 23:18

Acties:
  • SWINX
  • Registratie: Juni 2001
  • Laatst online: 30-12-2025

SWINX

doe het dan zonder die functie
code:
1

<tr onmouseover="this.style.background-color = 'black';" onmouseout="this.style.background-color = 'white';">

Mannen komen van Mars Tweakers, vrouwen van Venus Bokt

zondag 9 september 2001 23:33

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Op zondag 09 september 2001 23:18 schreef SWINX het volgende:
doe het dan zonder die functie
code:
1

<tr onmouseover="this.style.background-color = 'black';" onmouseout="this.style.background-color = 'white';">
Helaas werkt deze ook niet omdat ik dan syntax errors krijg. Maar het is wel een stuk makkelijker nu...Bedankt!
irritant dat je zo ingewikkeld gaat nadenken bij zo simpel iets...Maar ik ben nu nog niet echt verder want de foutmeldingen zijn nog steeds hetzelfde.

maandag 10 september 2001 00:24

Acties:
  • Pelle
  • Registratie: Januari 2001
  • Laatst online: 00:38

Pelle

🚴‍♂️

Ik weet niet of het ook bij een <tr> kan, maar voor een <td> kan het zeker weten. Ooit eens dit scriptje voor geschreven:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<script language="javascript" type="text/javascript">
<!--
    function changeBg(cellName,cellColor) {
         if (document.all) {
            document.all[cellName].bgColor = cellColor;
        }
    }
// -->
</script>   

<td id="cell1" bgcolor="#43798b">
<a href="#" class="menu" 
  onMouseOver="changeBg('cell1','#414656')"  
  onMouseOut ="changeBg('cell1','#43798b')">melp</a>
</td>

<tr> zul je dus even moeten proberen..

maandag 10 september 2001 00:47

Acties:
  • SWINX
  • Registratie: Juni 2001
  • Laatst online: 30-12-2025

SWINX

die syntax error komt omdat je een streepje '-' in je javascript code gebruik en dat snapt javascript niet

dit werkt wel:
code:
1
2
3
4
5

<table width=600>
<tr height=30 bgcolor=red
onmouseover="this.style.background = 'black';" 
onmouseout="this.style.background = 'red';">
<td></td></tr></table>

voorbeeld in actie => hier

Mannen komen van Mars Tweakers, vrouwen van Venus Bokt

maandag 10 september 2001 00:56

Acties:
  • jurriaan
  • Registratie: Januari 2000
  • Laatst online: 11-01 22:53

jurriaan

wat is de functie van het niet gebruiken van een functie :?

naast document.all, wat in principe alleen voor IE5> is, zou je in de functie van Pelle ook rekening kunnen houden met netscape oud m.b.v. document.layer en de nieuwere browsers met document.getElementById

Wees verantwoordelijk voor je eigen daden

maandag 10 september 2001 09:38

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Ik heb het inmiddels al voor elkaar gekregen.
Ik heb eerst een lijstje uitgeprint met alle objecten binnen het style object.. Wat blijkt nou: Alle object properties zijn zonder streepjes en case sensative.

Dus background-color wordt backgroundColor

Hier mee is alles nu opgelost. En het werkt ook nog perfect.
code:
1

<tr onmouseover="this.style.background-color = 'black';" onmouseout="this.style.background-color = 'white';">

wordt
code:
1

<tr onmouseover="this.style.backgroundColor = 'black';" onmouseout="this.style.backgroundColor = 'white';">

maandag 10 september 2001 11:09

Acties:
  • Pelle
  • Registratie: Januari 2001
  • Laatst online: 00:38

Pelle

🚴‍♂️

Op maandag 10 september 2001 00:56 schreef jurriaan het volgende:
naast document.all, wat in principe alleen voor IE5> is, zou je in de functie van Pelle ook rekening kunnen houden met netscape oud m.b.v. document.layer en de nieuwere browsers met document.getElementById
Document.layer gaat niet werken, aangezien het geen layer is waarvan de achtergrondkleur veranderd moet worden, maar een tabelcel met een ID.
Toen ik dit scriptje bouwde was er tevens nog geen NS6 op de markt, dus daar hoefde ik ook geen rekening mee te houden. Ik heb het niet aangepast omdat het verder geen functie had; NS-gebruikers ervaren dezelfde functionaliteit als IE-gebruikers, alleen die zien er ook nog een achtergrondkleurtje bij veranderen.

maandag 10 september 2001 11:59

Acties:
  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

Pelle:
(...)
NS-gebruikers ervaren dezelfde functionaliteit als IE-gebruikers, alleen die zien er ook nog een achtergrondkleurtje bij veranderen.
hmm :{
Als je dat geintje er bij NS6-gebruikers (en Mozilla 0.9x-gebruikers) kan laten zien, waarom dan niet? Is maar 1 regeltje code extra ... :?

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

maandag 10 september 2001 12:43

Acties:
  • Pelle
  • Registratie: Januari 2001
  • Laatst online: 00:38

Pelle

🚴‍♂️

Op maandag 10 september 2001 11:59 schreef drm het volgende:
hmm :{
Als je dat geintje er bij NS6-gebruikers (en Mozilla 0.9x-gebruikers) kan laten zien, waarom dan niet? Is maar 1 regeltje code extra ... :?
True, true
Maar zoals gezegd, dit scriptje stamt nog uit de tijd van ver voor NS6 & Mozilla, en het voegt (op de manier waarop ik het gebruikte) niks toe, behalve dus een verkleurende achtergrond.
Zou ik het nu schrijven, dan kwam dat regeltje er wel in ja :)

maandag 10 september 2001 12:52

Acties:
  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

Op maandag 10 september 2001 12:43 schreef Pelle het volgende:
(...)
Maar zoals gezegd, dit scriptje stamt nog uit de tijd van ver voor NS6 & Mozilla
Deze post niet: >:)
Op maandag 10 september 2001 00:24 schreef Pelle het volgende:
Ik weet niet of het ook bij een <tr> kan, maar voor een <td> kan het zeker weten. Ooit eens dit scriptje voor geschreven:
code:
1

(meuk)

<tr> zul je dus even moeten proberen..

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

maandag 10 september 2001 13:30

Acties:
  • Mart!
  • Registratie: Februari 2000
  • Laatst online: 26-01 20:55

Mart!

De DHTML reference van microsoft die ik altijd gebruik, maar altijd weer moeilijk om te vinden (bookmarken dus):

DHTML Reference

En dus ook het antwoord op jouw vraag:

Backgroundcolor Style

maandag 10 september 2001 14:53

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Op maandag 10 september 2001 13:30 schreef Mart! het volgende:
De DHTML reference van microsoft die ik altijd gebruik, maar altijd weer moeilijk om te vinden (bookmarken dus):

DHTML Reference

En dus ook het antwoord op jouw vraag:

Backgroundcolor Style
Allereerst...Bedankt voor deze supertip :D

Nu heb ik nog een probleempje...namelijk met deze code:
<INPUT TYPE="CHECKBOX" onclick="document.location.href='cat_edit.asp';">

Nu werkt dit perfect maar deze pagina wordt ingeladen in een IFRAME en dus laadt hij alles weer binnen in deze IFRAME.

Nu is mijn vraag. Hoe kan je de target specificeren. Op MSDN heb ik het gevonden maar dat werkt helaas niet goed...

Heeft iemand hier een oplossing voor?

maandag 10 september 2001 15:03

Acties:
  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

misschien
code:
1

window.frames [ 'iframenaam' ].location.href='url';

:?
* drm heeft niet zo veel ervaring met iframes


oh, en btw het is niet "document.location" maar "window.location"

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

maandag 10 september 2001 15:07

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Op maandag 10 september 2001 15:03 schreef drm het volgende:
misschien
code:
1

window.frames [ 'iframenaam' ].location.href='url';

:?
* drm heeft niet zo veel ervaring met iframes


oh, en btw het is niet "document.location" maar "window.location"
<INPUT TYPE="CHECKBOX" onclick="document.location.href='cat_edit.asp';">

Dat bedoel ik niet...
<INPUT TYPE="CHECKBOX" onclick="document.location.href='cat_edit.asp';">
zit al in een IFRAME...Nu moet de nieuwe pagina niet meer in de IFRAME geladen worden maar over de bestaande pagina (target=_top).

maandag 10 september 2001 15:52

Acties:
  • Pelle
  • Registratie: Januari 2001
  • Laatst online: 00:38

Pelle

🚴‍♂️

Op maandag 10 september 2001 15:07 schreef PhoneTechnician het volgende:
Nu moet de nieuwe pagina niet meer in de IFRAME geladen worden maar over de bestaande pagina (target=_top).
Das een leuke..
Ik denk dat het met parent.location.href wel moet lukken.

maandag 10 september 2001 16:43

Acties:
  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

als het in html target="_top" is, dan is het in JS top.location.href

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

maandag 10 september 2001 21:19

Acties:
  • PhoneTech
  • Registratie: Mei 2000
  • Laatst online: 23-02 19:42

PhoneTech

Topicstarter
Ik heb een veel leukere methode gevonden omdit voor elkaar te krijgen :) Met deze methode kan je metteen ook variabelen mee geven in een form dmv hidden fields.
code:
1
2
3
4

<tr onmouseover="this.style.backgroundColor = 'black';" onmouseout="this.style.backgroundColor = 'white';" onclick="document.forms[0].submit()">
<FORM ACTION="bladiebla.bla" METHOD="POST" ID="0" TARGET="_TOP">
...INPUT FIELDS...
</FORM>

Als je dus ergens een formulier hebt met ID = 0 dan kan je dat formulier dus verzenden zonder ooit maar op een submit knop te drukken...

dinsdag 11 september 2001 08:39

Acties:
  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

Ook leuk. Maar dat heeft er niet zo veel mee te maken, dacht ik zo :?

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz

Pagina: 1
Reageer

Apple iPhone 17 LG OLED evo G5 Google Pixel 10 Samsung Galaxy S25 Star Wars: Outlaws Nintendo Switch 2 Apple AirPods Pro (2e generatie) Sony PlayStation 5 Pro

Tweakers is onderdeel van DPG Media B.V.
Alle rechten voorbehouden - Auteursrecht © 1998 - 2026 • Hosting door TrueFullstaq