Tooltip an derselben Stelle

[tommycush]

Hi,

ich habe den allseits bekannten CSS Code für Tooltips auf meiner Seite eingebaut. Alles funktioniert wunderbar, nur daß der Div-Layer mit den Tooltips immer direkt neben den verschiedenen Links erscheint. Ich hätte gerne, daß die Tooltips aller Links exakt an derselben Stelle angezeigt werden (so eine Art Box, in der dann immer genauere Beschreibungen angezeigt werden).

Wie kann ich in CSS die Attribute so ändern, daß der Layer nicht relativ zum Link positioniert wird, sondern an einer festen Stelle auf der Webseite?

Hier mein Code:

a.info{
	position:relative;
	z-index:24;
	background-color:none;
	color: #FFFFFF;
	cursor:help;
	text-decoration:none;
	text-decoration: none;
}

a.info:hover {
	z-index:25;
	background:transparent;
	color: #FF0000;
	text-decoration: none;
}

a.info span {
	display: none;
}

a.info:hover span.doc1 {
	display:block;
	position:absolute;
	top:-20px;
	left:150px;
	width:300px;
	border:none;
	background: transparent;
	color:#bbbbbb;
	text-align: left
	padding: 10px;
	font-size: 10pt;
}

und der HTML-Teil:

<a class=info href="#">Five Days<span class=doc1>Fünf Tage ist ein Auszug aus meiner Diplomarbeit, die ich in einem Flüchtlingslager in Mazedonien fotografiert habe. Dies sind einige Eindrücke, die ich damals gesammelt habe. [22 Bilder]</span></a>

Danke im Voraus,
Martin

 

[Quaese]

Hi,

nimm die Zeile

position:relative;

aus der Klasse a.info. Anschliessend kannst du über a.info:hover span.doc1 die
Position angeben, an der der Tooltip angezeigt werden soll (top/left).

Ciao
Quaese