nicht angemeldet
Hallo zusammen
Ich habe ein Problem und irgendwie stehe ich auf dem Schlauch, obwohl es warscheinlich gans einfach ist.
Ich habe auf meiner Seite http://www.madcv.de/newpage_test/work/index.shtml einen Tooltip angelegt: Siehe rechts - Schaltfläche "Nächster Termin".
Das funktioniert auch. Nur bekomme ich es nicht hin, dass mir der Tooltip sich in voller Größe darstellt (also über den div hinaus ragt).
CSS-Code:
#news {
width: 120px; height: 328px;
margin-top: 11px; margin-left: 624px;
padding: 10px;
border: 1px solid #333333;
background-color: #F8F8F8;
overflow-x:hidden;
overflow-y:scroll;
position: absolute;
z-index: 500;
}
/* Tooltip */
#news a.tooltip,
#news a.tooltip:link,
#news a.tooltip:visited,
#news a.tooltip:active {
position: relative;
text-decoration: none;
font-style: bold;
}
#news a.tooltip:hover {
background: transparent;
z-index: 502;
}
#news a.tooltip span {
display: none;
text-decoration: none;
}
#news a.tooltip:hover span {
display: block;
position: relative;
top: -25px;
left: 0px;
width: 100%;
height: 50px;
z-index: 503;
margin-bottom: 0px;
color: #000000;
border: 1px solid;
border-color: #000000;
padding: 2px 10px 2px 10px;
background: #CCCCCC;
font-family: Arial;
font-style: Normal;
text-align: left;
}
HTML-Code:
<div id="news">
<div style="width:100%; position:absolute;display:block;z-index:501">
<a href="#" class="tooltip"><img style="top:-8px; left:10px; border:1px solid #CCCCCC;" src="images/termin.png" alt="Nächster Termin">
<span>
<table border="1" frame="box" rules="all">
<tr><th>Datum</th><th>Tag</th><th>Was</th><th>Wo</th><th>Uhrzeit</th><th>Treffpunkt</th><th>Mit</th></tr>
<tr id="20090424"> <td>24.04.09</td><td class="center">FR</td><br><td>Freitag</td> ... <td class="center">Z</td>
</table>
</span>
</a>
</div>
...
</div>
Zur Erklärung: Die Zeile mit "id=20090424" wird von einem JavaScript geliefert.
HTML im Qelltext - Zeilen 222 bis 246.
JavaScript im <head> - Zeilen 29 bis 54.
Danke schon mal für eure bemühungen
MfG Pfid
MudGuard