Jetzt kostenlos Anmelden!


Janni

unregistriert

1

Mittwoch, 18. Juni 2008, 20:12

CSS und Tabellenlayout

Hallo,

ich bräuchte einmal netterweise eure Hilfe. Ich würde gern für alle Tabellen eine einheitliche Darstellung haben. Und zwar, wenn ich mit der Maus auf eine Zeile in einer Tabelle fahre, dann soll der Hintergrund dieser Zeile etwas aufhellen.

Auf www.lcl-online.de habe ich das gesehen. auf der Startseite im unteren Teil der Seite. Dort ist ein ForumTicker. Wenn man da mit der Maus drüber fährt, wird die entsprechende Zelle heller. Ich hätte es gern, das die ganze Zeile heller wird. Kann mir jemand helfen?

Danke euch!
  • Zum Seitenanfang
  • Zum Seitenende

Proggi

unregistriert

2

Mittwoch, 18. Juni 2008, 20:34

Hier ein kleines Beispiel wie es gehen könnte.

Quellcode

1
2
3
4
5
6
7
<table width="500" border="1">
	<tr id="row">
		<td onmouseover="document.getElementById('row').style.backgroundColor='#333333'" onmouseout="document.getElementById('row').style.backgroundColor='#ffffff'">Spalte 1</td>
		<td onmouseover="document.getElementById('row').style.backgroundColor='#333333'" onmouseout="document.getElementById('row').style.backgroundColor='#ffffff'">Spalte 2</td>
		<td onmouseover="document.getElementById('row').style.backgroundColor='#333333'" onmouseout="document.getElementById('row').style.backgroundColor='#ffffff'">Spalte 3</td>
	</tr>
</table>


Netten Gruß :) Andy --- Proggi
  • Zum Seitenanfang
  • Zum Seitenende

Janni

unregistriert

3

Mittwoch, 18. Juni 2008, 22:20

ja, so habe ich mir das vorgestellt, doch wie schaffe ich es, das es bei jeder Tabelle automatisch übernommen wird? Das geht doch mit CSS oder? ich möchte nicht jede Tabelle jetzt editieren...
  • Zum Seitenanfang
  • Zum Seitenende

Headless Männlich

... nur noch zur deko

Beiträge: 2 374

Geschlecht: Männlich

Wohnort: Nürnberg

PHPKIT Version: keine

4

Mittwoch, 18. Juni 2008, 23:12

Warum macht ihr das nicht via CSS? Also ich bin jetzt absolut niemand der sich mir Design etc auskennt aber probiere es mal so:

Quellcode

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
41
42
43
44
45
46
47
48
<html>
<head>
	<title>Hover TEST</title>
	<style type="text/css">
	<!--
	
	tr.dummy {
		color: 000;
		background-color: #FFF;
		border: solid 1px #CC0000;
		
		display: block;
		width: 100px;
		margin-bottom: 5px;
	}

	tr.dummy:hover {
		color: #FFF;
		background-color: #CC0000;
		border: solid 1px #000;
	} 
	-->
	</style>
</head>
<body>

<table border="0">
	<tr class="dummy">
		<td>test1</td>
	</tr>
	<tr class="dummy">
		<td>test1</td>
	</tr>
	<tr class="dummy">
		<td>test1</td>
	</tr>
	<tr class="dummy">
		<td>test1</td>
	</tr>
	<tr class="dummy">
		<td>test1</td>
	</tr>
	<tr class="dummy">
		<td>test1</td>
	</tr>
</table>
</body>
</html>
So einfach wie möglich - aber nicht einfacher!
Albert Einstein (1879-1955)
  • Zum Seitenanfang
  • Zum Seitenende

Proggi

unregistriert

5

Mittwoch, 18. Juni 2008, 23:26

Haste auch wieder recht ^^

Wobei er hier auch nicht alles "automatisch" übernommen wird.
Wobei ich mich frage, ob sowas wirklich Sinn macht ;)
Die erste Möglichkeit könnte man in einer JS-Funktion bewerkstelligen.

Auf jeden Fall müssen immer alle Tabellen bzw Tabellenreihen bearbeitet werden - egal wie man es macht. Der Browser muss ja wissen was er wann machen muss.
Und Designer bin ich auch keiner.... Sieht man ja oft genug 8)

Netten Gruß und gute Nacht....... um 4 Uhr ist die Nacht wieder vorbei
Andy --- Proggi
  • Zum Seitenanfang
  • Zum Seitenende

Janni

unregistriert

6

Mittwoch, 18. Juni 2008, 23:28

funktioniert leider nicht... Aber so wollte ich es haben. Wenn irgendwo auf meiner Seite eine Tabelle vorkommt, und ich mit der Maus rüber fahre, das die Zeile dann etwas hevorgehoben wird.
  • Zum Seitenanfang
  • Zum Seitenende

Headless Männlich

... nur noch zur deko

Beiträge: 2 374

Geschlecht: Männlich

Wohnort: Nürnberg

PHPKIT Version: keine

7

Donnerstag, 19. Juni 2008, 02:17

Such doch einfach mal bei Google nach "css+table+hover" - da wirst du massig finden!

Gruß
So einfach wie möglich - aber nicht einfacher!
Albert Einstein (1879-1955)
  • Zum Seitenanfang
  • Zum Seitenende

HiGHteK Männlich

findet sich zurecht

Beiträge: 144

Geschlecht: Männlich

PHPKIT Version: 1.6.03

8

Donnerstag, 19. Juni 2008, 07:19

Bei einer Lösung wo nur CSS zum Einsatz kommt, gibts AFAIK mal wieder Probleme mit dem IE. Der kennt (bis Version 6?!) die Pseudoklasse hover nur bei Links und würde somit die CSS-Definitionen ignorieren bzw. nicht verstehen.
Dort müsste man dann eben auf eine Javascriptlösung ausweichen oder den IE einfach nicht mehr berücksichtigen...
Ich tendiere zu letzterem :D

Aber das nur als Anmerkun am Rande...Lösungsansätze gabs ja genug ;)

Grtz
[Bevor du jemanden mit Füßen trittst, überleg ob du einem eventuellen Echo gewachsen bist]
  • Zum Seitenanfang
  • Zum Seitenende

Janni

unregistriert

9

Donnerstag, 19. Juni 2008, 11:38

Also finden tue ich bei meinem Freund genug. Doch nicht das was ich brauche. Die arbeiten alle mit class="keineahnung". Doch ich ändere doch jetzt nicht jede Tabelle. Da säße ich ja lange dran. Das muss doch auch irgendwie anders gehen. Sobald er eine Tabelle sieht, soll halt jede Zeile beim Mouseover die Farbe ändern.



Oder womit ich auch zufrieden wäre, wenn jede zweite Zeile, einfach etwas heller wäre, als die anderen. Also z.B. die erste Zeile hat die Farbe #000000 die zweite Zeile #FFFFFF die dritte dann wieder #000000 die vierte dann #FFFFFF usw. Das geht doch auch, oder? Nur womit darf ich meinen Freund bestücken?



Danke euch sehr!
  • Zum Seitenanfang
  • Zum Seitenende

Dirk Kántor Männlich

aká Dooki

Beiträge: 2 074

Geschlecht: Männlich

PHPKIT Version: keine

10

Donnerstag, 19. Juni 2008, 12:27

reden wir hier von html ausserhalb des phpkits?
:thumbsup:    :thumbsup:       *tc*       :thumbsup:    :thumbsup:
8o           Achtung: Dirk Kántor ist unterwegs!           8o
Er verteilt gerne Verwarnungen ohne vorher darüber diskutiert zu haben.
  • Zum Seitenanfang
  • Zum Seitenende