WCM Forum - HTML: Links und änderung der Hintergrundfarbe beim mouseover in table rows

WCM Forum (http://www.wcm.at/forum/index.php)

- Programmierung (http://www.wcm.at/forum/forumdisplay.php?f=17)

- - HTML: Links und änderung der Hintergrundfarbe beim mouseover in table rows (http://www.wcm.at/forum/showthread.php?t=92837)

HTML: Links und änderung der Hintergrundfarbe beim mouseover in table rows

Hallo

Ich bin gerade daran mit PHP und mySQL einen Teil eines Projektes bei uns in der Schule zu programmieren und dabei kommt eine große Tabelle vor.
Ich würde die gerne so gestalten wie die zB im neuen PHPMyAdmin, so dass sich sobald man den Mauszeiger drüberbewegt der Hintergrund der aktuellen Reihe hervorgehebt wird und ein link über die ganze Zeile ist, so dass man auch auf die Zwischenräume zwischen der Schrift klicken kann.
Die bei PHPMyAdmin haben das mir irgendeinem JavaScript gemacht und die einzige HP auf der ich das auch mal gesehen hab, find ich jetzt nicht mehr...

Danke schon mal, schönen Gruß
Nestrus

Jetzt weiß ich auch, wiso es jetzt nicht mehr geht:
Vorher hab ich mit dem IE getestet, dort ging das mit einem link über die ganze Zeile, jetzt wo ich mit mozilla teste, gehts nicht mehr.... :(

Code:

<html>

 <head>

  <script language="javascript">

   function l_over(id)

   {

    document.getElementById(id).style.backgroundColor = "ccccff";

   }

   function l_out(id)

   {

    document.getElementById(id).style.backgroundColor = "cccccc";

   }

  </script>

 </head>

 <body>

  <table>

   <tr id="1" style="background-color:#cccccc;" onmouseover="l_over(1)" onmouseout="l_out(1)">

    <td></td>

   </tr>

   <tr id="1" style="background-color:#cccccc;" onmouseover="l_over(2)" onmouseout="l_out(2)">

    <td></td>

   </tr>

   <tr id="1" style="background-color:#cccccc;" onmouseover="l_over(3)" onmouseout="l_out(3)">

    <td></td>

   </tr>

  </table>

 </body>

</html>

lustig... ich hatte vor kurzem genau das gleiche problem...

ich hab das so gelöst:

Code:

<script language="javascript">

function link(url,frame) {

window.open(url,frame);

}

</script>



[...]



<td class="link" onmouseover="this.style.backgroundColor='#A4A8F2',this.style.color='white'"

onmouseout="this.style.backgroundColor='white',this.style.color='black'"

onclick="link('http://www.ams-wien.at','_blank')">Homepage Schule</td>

jetzt meine frage: da ich keinen echten link habe (a href...) hab ich angst, dass das nicht richtig mit allen browsern funktioniert... ist das script in ordnung oder sollte ich was ändern?

ich hab das übrigens auf http://www.ams-7c.de.vu eingesetzt! (geht leider bis morgen um 7 nicht wegen serverarbeiten...)

Danke dub, aber jetzt muss ich meine Frage ja neu definieren:
Ich hatte einen Link über die ganze Reihe, so das man auf die Zwischenräume auswählen konnte, der ja -wie mittlerweile herausgefunden- halt nur mit dem IE geht, für mich also vollkommen unakzeptabel.
Da im IE aber der Mauszeiger nicht zu einer Hand wurde sondern zu einem "I" wurde, wollte ich noch optisch den link hervorheben und nebenbei in breiten Tabellen, bei denn einige Spalten leer sein können das lesen erleichtern und hab das so gelöst:
<tr onmouseover="this.bgColor='#Farbe1';" onmouseout="this.bgColor='#Farbe2';">
Jetzt fehlt mir eigentlich nur noch das mit dem link, muss ich dazu auch ein JavaScript machen, dass ich zusätzlich beim onmouseover starte?

Zitat:

Original geschrieben von heli2sky
lustig... ich hatte vor kurzem genau das gleiche problem...

ich hab das so gelöst:

Code:

<script language="javascript"> function link(url,frame) { window.open(url,frame); } </script> [...] <td class="link" onmouseover="this.style.backgroundColor='#A4A8F2',this.style.color='white'" onmouseout="this.style.backgroundColor='white',this.style.color='black'" onclick="link('http://www.ams-wien.at','_blank')">Homepage Schule</td>

jetzt meine frage: da ich keinen echten link habe (a href...) hab ich angst, dass das nicht richtig mit allen browsern funktioniert... ist das script in ordnung oder sollte ich was ändern?

ich hab das übrigens auf http://www.ams-7c.de.vu eingesetzt! (geht leider bis morgen um 7 nicht wegen serverarbeiten...)

Ah, danke.. (Ich sollte das nächste mal wohl das Fenster reloaden, wenn ich schon so lange mit antworten warte...)
Wir haben eh fast das gleiche gedacht, ich habs jetzt so gemacht:

Code:

<tr onmouseover="this.bgColor='#Farbe'" onmouseout="this.bgColor='#Farbe';" onclick="window.open('url')">

Und es funktioniet mit mozilla wunderbar, also schätze ich auch das es mit allen anderen browsern geht...

PS: Ach ja, dein script finde ich übrigens ziemlich sinnlos (aber das bei dub auch)...

Der erstbeste Popup blocker wird bei window.open sofort in Aktion treten.

Besser du löst das mit document.href="" i´m onclick event.

Ach ja, uf was reagieren diese Pop-Up Blocker? Auf die Phrase window.open?
Dann passt eh, weil durch das komische Fuesbox Zeugs und so, in dem wir das ganze Projekt entwickeln hat dafür eh eigene Funktionen (openwindow()), wegen dem Titel und so Zeugs, ich hab das nur für hier so geschreiben, dass es auch ohne unsere scriptdateien geht.

hi! wie geht das genau mit dem document.href? ich hab das nicht hinbekommen, dass es geht!

onlclick="window.location.href='http://www.url.at'"

oder... "parent.frames[2].location.href=''"
wobei hier der 3. frame als "Ziel" angegeben ist. egal wie er heisst.