CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede rexdegn Nybegynder
18. juni 2003 - 17:10 Der er 12 kommentarer

Skift baggrunds billede på alle TD'er i en TR med onMouseOver

Hej jeg har et problem - kan du hjælpe?

Jeg har et table med flere felter og det skulle gerne virke sådan at alle min TD'er i et TR skifter baggrundsbillede når man ruller musen ned over - også selvom at det er på TD'en ved siden af. Desuden skal hele TR virke som link.
Tabel struktur er i retningen af dette:

<TABLE>
<TR>
<TD>Oprettet</TD><TD>navn</TD><TD><email></td>
</TR>
</TABLE>

Hvad gør jeg? - hjælp!!!! (så får du point ;-))
Avatar billede gumphfy Nybegynder
18. juni 2003 - 17:17 #1
lad mig lige forstå det rigtigt:
du vil have et billed, og når man flytter musen hen over det billede skal det skifte til et andet billede, og samtidig vare et link.

hvis jeg har forstået det rigtigt så lyder det som et image roll over.

det ser sådan her ud:

<!-- Rollover Image Script - Place within <head> tag -->
<script language="JavaScript" type="text/javascript">
<!-- Hide from older browsers
function SwitchImg()
{ //start
  var rem, keep=0, store, obj, switcher=new Array, history=document.Data;
    for (rem=0; rem < (SwitchImg.arguments.length-2); rem+=3) {
        store = SwitchImg.arguments[(navigator.appName == 'Netscape')?rem:rem+1];
    if ((store.indexOf('document.layers[')==0 && document.layers==null) ||
        (store.indexOf('document.all[')==0 && document.all==null))
        store = 'document'+store.substring(store.lastIndexOf('.'),store.length);
        obj = eval(store);
    if (obj != null) {
        switcher[keep++] = obj;
      switcher[keep++] = (history==null || history[keep-1]!=obj)?obj.src:history[keep];
      obj.src = SwitchImg.arguments[rem+2];
  } }
  document.Data = switcher;
} //end

function RestoreImg()
{ //start
  if (document.Data != null)
    for (var rem=0; rem<(document.Data.length-1); rem+=2)
      document.Data[rem].src=document.Data[rem+1];
} //end

// end hiding contents -->
</script>

<a href="hjemmeside.html" onMouseOut="RestoreImg()" onMouseOver="SwitchImg('document.roll over','document.roll over','image2')"><img src="billede" name="roll over" width="0" height="0" alt="link" border="0"></a>


hvis der var det du er ude efter, så tag og studer de her coder...
Avatar billede roenving Novice
18. juni 2003 - 17:20 #2
<HTML>
<SCRIPT language="javascript" type="text/javascript">
function changeRed(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundColor="red"
}
}
function changeWhite(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundColor="white"
}
}

</SCRIPT>
</HEAD>
<BODY>
<TABLE>
<TR onmouseover="changeRed(this);" onmouseout="changeWhite(this);">
<TD>Oprettet</TD><TD>navn</TD><TD><email></td>
</TR>
</TABLE>

</BODY>
</HTML>
Avatar billede roenving Novice
18. juni 2003 - 17:21 #3
Så må du lige specificere hvordan man holder styr på hvilke billeder, der skal være hvor
-- ovenstående eksempel viser bare hvad man kan ...
Avatar billede rexdegn Nybegynder
18. juni 2003 - 17:22 #4
Du skal vide at det er et baggrundbillede i en <TD> og når man føre musen over linket i <TD>Link</TD> skal den skifte baggrundsbillede på alle <TD>'er i det <TR>. Desuden skal baggrund skiftes uanset om der er link i tabelcellerne eller ej... er det dårlift forklaret???
Avatar billede gumphfy Nybegynder
18. juni 2003 - 17:31 #5
naaaj, hmm.

hvis du nu skriver:

<TABLE>
<TR onmouseover="changeRed(this);" onmouseout="changeWhite(this);">
<TD><a href="">Oprettet</TD><TD>navn</TD><TD><email></td></a>
</TR>
</TABLE>

og så kan du altid lave en <style> i <head> og skrive text-decoration:none; og vælge hvilken farve du vil ha'

prøv det lige
Avatar billede roenving Novice
18. juni 2003 - 17:32 #6
<HTML>
<SCRIPT language="javascript" type="text/javascript">
var imgs = new Array();

imgs[0] = new Array();
imgs[0][0] = new Image();
imgs[0][0].src = baggrund1.gif;
imgs[0][1] = new Image();
imgs[0][1].src = baggrund2.gif;
imgs[0][2] = new Image();
imgs[0][2].src = baggrund3.gif;

imgs[1] = new Array();
imgs[1][0] = new Image();
imgs[1][0].src = baggrund1_o.gif;
imgs[1][1] = new Image();
imgs[1][1].src = baggrund2_o.gif;
imgs[1][2] = new Image();
imgs[1][2].src = baggrund3_o.gif;


function changeOver(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundImage="'url("+imgs[1][i].src+")'";
}
}
function changeOut(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundImage="'url("+imgs[0][i].src+")'";
}
}

</SCRIPT>
</HEAD>
<BODY>
<TABLE>
<TR onmouseover="changeOver(this);" onmouseout="changeOut(this);">
<TD>Oprettet</TD><TD>navn</TD><TD><email></td>
</TR>
</TABLE>

</BODY>
</HTML>
Avatar billede rexdegn Nybegynder
18. juni 2003 - 23:12 #7
roenving... dit script laver fejl, men gumphfy WOW! Perfekt og simpelt...

Nu mangler jeg bare at skifte til baggrundsbillede istedet for farve, hvordan skriver man det??????

</head>
<SCRIPT language="javascript" type="text/javascript">
function changeRed(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundColor="red"
}
}
function changeWhite(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundColor="white"
}
}

</SCRIPT>
</HEAD>
<BODY>
<TABLE cellpadding="0" cellspacing="0">
<TR onMouseOver="this.style.cursor='hand'; changeRed(this);" onmouseout="changeWhite(this);">
<TD width="127">Oprettet</TD><TD width="85">navn</TD><TD width="206">email</td>
</TR>
</TABLE>
</body>
Avatar billede roenving Novice
18. juni 2003 - 23:19 #8
Når du nu har taget mit script og viser, kan du vel også sige hvad for en fejl mit andet script kommer med ?-)
Avatar billede roenving Novice
18. juni 2003 - 23:20 #9
Forøvrigt mangler der en <head> i alle udgaver indtil nu ...
Avatar billede rexdegn Nybegynder
18. juni 2003 - 23:23 #10
Sorry Roenving.... det var jo dit der virkede sorry... vedrørende head... det er jo blot en sniplet af koden ;-) men hvordan sætter jeg baggrundbillede ind istedet for farve i det kode jeg har brugt???
Avatar billede roenving Novice
18. juni 2003 - 23:26 #11
function changeOver(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundImage="url("+imgs[1][i].src+")";
}
}
function changeOut(r){
for (i=0;i<r.children.length;i++){//>
r.children[i].style.backgroundImage="url("+imgs[0][i].src+")";
}
}

-- prøv at fjerne 'erne -- jeg har ikke lige eksempler på billeder, jeg kan bruge, så jeg kan ikke selv gå det igennem i detaljer ...
Avatar billede roenving Novice
18. juni 2003 - 23:27 #12
Det virker nu for mig -- med den tilføjelse, at du skal huske at sætte gåseøjne på:

imgs[1][2].src = "baggrund3_o.gif";
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
Returner ikke alt Af ingeman i JavaScript 13 26/06/202414:40 01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript 4 24/06/202422:50 26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript 6 04/06/202416:23 05/06/202414:23
Ajax - indlæs webside og derefter hente data Af nemlig i JavaScript 4 21/05/202417:19 22/06/202422:07
Disable button efter 1. klik Af nemlig i JavaScript 2 05/05/202415:37 05/05/202416:25
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 22:41 Hjælp til at skrive opgave Af Needhelp i Småopgaver
I går 14:04 Pixeline cd’er til PC Af Mathilde i Windows
I går 01:14 Windows 10 - IIS 10 Af bsn i Windows
04/0720:39 Boot fra USB Af poulmadsen i Windows
04/0711:43 Gmail-ikon på skrivebordet Win 10 Af ErikHg i Fri debat
White papers
Flere white papers »


Premium
Teaser billede
Dynamics-kæmpen Cepheo leverer røde tal i første regnskab som selvstændigt selskab
Læs mere »
IBM-direktør efter blodrødt regnskab: “Vi er godt på vej ud af det stormvejr, som ramte os i 2023”
Stiftere overvejer at gøre Flatpay til en bank – krav om compliance er en stopklods
Rejsekort reducerer kraftigt den tid, som selskabet vil beholde dine lokationsdata i: Vil nu slette dem efter få måneder
Se alle »
Computerworld
Teaser billede
Test: Endelig en skærm der er god til alt - lige fra gaming og underholdning til kontorbrug
Læs mere »
I dag træder nye de regler om registrering af din arbejdstid i kraft: Er du klar?
700.000 Linux-systemer kan været truet af ny alvorlig sårbarhed
En pladesaks, 1000W og et Nvidia-grafikkort til 14.000 kroner - sådan opgraderede jeg min pc
Se alle »
CIO
Teaser billede
I dag træder nye de regler om registrering af din arbejdstid i kraft: Er du klar?
Læs mere »
Russisk hack af Microsoft er meget større end først antaget
Efter stort hackerangreb mod Teamviewer: Stop dine opdateringer og tjek opsætningen nu
Halter mange år bagefter: Langsom software-udvikling udfordrer kæmpe digitalt løft af Billund Lufthavn
Se alle »
Job & Karriere
Teaser billede
Bo solgte sit software-system for et treciftret millionbeløb: Brugte pengene på at købe 80 medarbejdere til ny storsatsning
Læs mere »
Norlys skal splittes op i fem selskaber: Nu bliver flere ansatte og ledere fyret
Dansk top-profil trækker sig fra Microsoft: Skal være direktør i TDC Erhverv
IBM Danmark skifter ud i sin øverste ledelse - her er den nye direktion
Se alle »
White paper
Teaser billede
Sådan gør du: Elektronisk dokumentudveksling i praksis
Læs mere »
Guide: Sådan udvikler du en moderne netværksstrategi
Vejen væk fra WAN: Sådan skifter du til en moderne infrastruktur
Sådan får du overblik og beskytter dine cloudapplikationer
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »