• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Tabellenzelle per mouseover css änder

reni

reni

Lounge-Member
Tabellenzelle per mouseover und klick css ändern

Hallo...

ich möchte gerne eine Tabellenzelle (und den link darin) per css (oder auch js) ändern
das probelm: ändern alleine is klar krig ich hin zur not auch mit js this.style..
ABER bitte wie mache ich, dass das aktive feld dann auch aktiv bleibt also beim draufklicken soll das feld eine andere HG-farbe bekommen

ich habe hier schon mal eine variante probiert aber das funktioniert nicht wirklich... hat jem. einen tipp für mich wie ich die dinger bei draufklicken und drüberfahren einfärbe ohne dass sie sich wieder entfärben, wenn ich wegrolle von dem button?

hier das css funzt auch nicht der link und sein kleiner bacckground wird geändert aber nicht die zelle dahinter!
<style>
.link1 {background: #8A9BB7; font-family: Verdana; font-size: 10px; color: #FFFFFF; text-decoration: none}
.link1:hover {background: #55698A; font-family: Verdana; font-size: 10px; color: #FFFFFF; text-decoration: none}
.link1:active {background: #55698A; font-family: Verdana; font-size: 10px; color: #FFFFFF; text-decoration: none}

.bg1 {background: #8A9BB7}
.bg1:hover {background: #55698A}
.bg1:active {background: #55698A}
</style>
 
Zuletzt bearbeitet:
AW: Tabellenzelle per mouseover und klick css ändern

aaaaalso reni :hover etc... funzt nur bei links (a).

du könntest zum beispiel mit einem Script fragen wie der text in deinem div grad ist...
zB:
if (document.getElementById('dein_div').innerHTML == "bla bli blupp")
this.style.backgroundColor = '#FF0000';
 
AW: Tabellenzelle per mouseover und klick css ändern

Du kannst die Tabellenzelle dauerhaft ändern, indem Du folgendes Statement benutzt:

document.get ElemtById("Zelle1").setAttribute('class','bg2');

Anstatt getElementById kannste natürlich auch alle anderen Methoden mit getElement... benutzen.
 
@ mani... es soll nich permanet geändert bleiben wenn ich dann auf den nächsten lin gehe.. soll wieder der ursprungszustand hergestellt werden... geht das?
 
Wenn ich das richtig verstehe, soll der geänderte Zustand solange erhalten bleiben, wie Sich die Mouse in der Zelle, respektive der Link active ist. Beim Klick auf den Nächsten Link, soll die nächste Zelle geändert und die vorherige auf den Ursprungszustand zurückgesetzt werden.

Ich würde da ne Schleife bauen, die per Event-Handler aufgerufen wird und die ensprechenden Elemente alle durchläuft, und bis auf das aktuelle Element alle wieder in den Ursprungszustand zurückversetzt.

Hab jetzt aber keine Zeit, das als Beispiel zu coden. Muß schnell in die Stadt. Wenns nachher noch reicht, mach ich dir mal sowas.
 
das wäre super.. schleifchen binden kann ich aber ne schleife schreiben?
is ok kauf mal was feines ein,.. bin ja froh wenn es überhaupt eine lösung gibt :)
die funktionsweise is so in etwa wie hier nur dass das was ich da gemacht habe erstens total unübersichtlich ist... und 2. nicht im NS7 funzt...joah...

also genau bei mouseover und mouseout einfach der wechsel der link und HG-farbe und bei klick die overfarbe anzeigen ... wenn ich auf den nächsten link KLICKE soll die vorhergehend aktive farbe wieder weg sein.... mmh also ich glaube die hast es schon richtig verstanden

danke dir schonmal.. für deine evtl folegende mühe ;-)
 
Falls ich Dich richtig verstanden habe, würde ich es so versuchen:
(CSS ist leider nicht dabei, dafür auch keine Schleife....)

---
<html>
<head>
<script language = "javascript" type = "text/javascript">
<!--
gOldTr = null;

function change (tr) {
if (tr != gOldTr)
tr.style.backgroundColor= "red";
}

function unchange (tr) {
if (tr != gOldTr) tr.style.backgroundColor= "white";
else tr.style.backgroundColor = "green";
}

function mark (tr) {
tr.style.backgroundColor = "green";
if (gOldTr) gOldTr.style.backgroundColor = "white";

gOldTr = tr;
}

//-->
</script>

<body>
<table border = 1>
<tr onmouseover = "change(this)" onmouseout = "unchange(this)" onclick = "mark(this)"><td> Linie 1 </td> </tr>
<tr onmouseover = "change(this)" onmouseout = "unchange(this)" onclick = "mark(this)"><td> Linie 2 </td> </tr>
</table>
</body>
<html>



edit:::: weitere Felder kannst Du per Copy & paste anhängen...
... und über meine Farbkorbination lässt sich streiten :)
luz
 
Zuletzt bearbeitet:
hey hey hey es funktioniert.. (also muss noch ein bissel rumbasteln aber die ersten versuche zeigen wiiirkung)

@manitou also ich glaube du musst dich bei dem schönen wetter doch nich mit meinen problemen rumschlagen :)

@ Luz ... vielen dank... :) --- könnt dir grad um hals springen :) hihi
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben