Tabellenzellen hovern: Rollover-Effekt mit CSS (HTML, CSS und Javascript)

format_c

2003-11-25 23:29

User since
2003-08-04
1706 Artikel
HausmeisterIn

Hi.

Ich suche eine Mlöglichkeit die Zellenhintergrundfarbe einer Zelle zu ändern wenn jemand mit dem Mauszeiger drüber geht.

Ich weis auch ungefähr wie es funktioniert, jedoch braucht man dazu IMHO JavaScript.

Kann mir bitte jemand eine Möglichkeit sagen wie man das lösen kann und dabei die Seite für möglichst alle Browser kompatibel bleibt?

Gruß Alex

Effizente Linuxshell

jan

2003-11-25 23:40

User since
2003-08-04
2536 Artikel
ModeratorIn

mit javascript sollte das ohne weiteres möglich sein, mit purem css imho nicht, da hover keine allgemeine angabe ist.
mit js:
für die neuen browser, die das DOM unterstützen (if(document.getElementById)), machst du es darüber, für die älteren musst du dir die entsprechenden wege suchen - sollte aber kein problem sein. beim iex sollte eigentlich irgendwas wie
<td onmouseover="this.style.bgcolor = '#ffffff';"> funktionieren, aber vielleicht war's auch styles... ob's bgcolor hieß, da bin ich nicht mehr ganz sicher, ich meine es jedoch - auch, wenn die css-eigenschaft background-color heißt...

jan

2003-11-25 23:40

User since
2003-08-04
2536 Artikel
ModeratorIn

da fällt mir gerade ein, dass phpmyadmin imho so eine funktion hat - schau doch da einfach mal nach...

format_c

2003-11-25 23:46

User since
2003-08-04
1706 Artikel
HausmeisterIn

Bingo. phpMyAdmin hat genau das was ich brauche.

Danke.

Gruß Alex

Effizente Linuxshell

x-man

2004-04-18 00:08

User since
2003-09-11
67 Artikel
BenutzerIn
[default_avatar]

Code: (dl )

<script language="javascript">
	function textYes(ziel){
		ziel.style.backgroundColor="#ddddff";
	}
	function textNo(ziel){
		ziel.style.backgroundColor="white";
	}
</script>
<td onMouseover="textYes(this)" onMouseout="textNo(this)">

Gast Gast

2004-04-18 16:53

Das hat natürlich den 'kleinen' Nachteil daß es nicht funktioniert wenn der Client 'JavaScript' abgeschaltet hat ;)

P.S.
Hat schon mal jemand von Euch eine CSS-Syntax gesehen mit der man die Eigenschaften des <select> Tags ändern kann?\n\n

[E|B]

2004-04-18 19:21

User since
2003-08-08
2561 Artikel
HausmeisterIn

@Dieter

So was?

Code: (dl )

1
2
3

select     { background-color: #D7D7D7; }
select     { font-family: Verdana, Arial, Lucida, Helvetica, Sans-Serif; }
select     { font-size: 9px; }

Ändert jetzt speziell alle Select-Fields.

Gruß, Erik!

s))91\&\/\^z->sub{}\(\@new\)=>69\&\/\^z->sub{}\(\@new\)=>124\&\/\^z->sub{}\(\@new\)=>);
$_.=qq~66\&\/\^z->sub{}\(\@new\)=>93~;for(@_=split(/\&\/\^z->sub{}\(\@new\)=>/)){print chr;}

It's not a bug, it's a feature! - [CGI-World.de]

Gast Gast

2004-04-18 19:26

Ja E|B
das funktioniert bestens, aber ich meinte Rahmen und Scrollbar ...

[E|B]

2004-04-18 19:48

User since
2003-08-08
2561 Artikel
HausmeisterIn

Select-Fields stellen bei der Formatierung eines der größten Probleme dar. Die Rahmen des Select-Feldes lassen sich nicht formatieren, ebenso wenig die Scrollbalken. Nach einer Lösung braucht man also erst gar nicht suchen.

Gruß, Erik!

s))91\&\/\^z->sub{}\(\@new\)=>69\&\/\^z->sub{}\(\@new\)=>124\&\/\^z->sub{}\(\@new\)=>);
$_.=qq~66\&\/\^z->sub{}\(\@new\)=>93~;for(@_=split(/\&\/\^z->sub{}\(\@new\)=>/)){print chr;}

It's not a bug, it's a feature! - [CGI-World.de]

Gast Gast

2004-04-18 19:53

Na das ist doch mal ne klare Aussage.
Frag mich nicht wie oft und wie lange ich damit schon rumgehampelt habe - Ächz ...
Danke für den Hinweis.