nicht angemeldet
Hallo!
Auf der Homepage von meinem Verein möchte ich gerne eine News-Sparte einbauen, in der ich dann Kurzmeldungen notiere, allerdings dann mittels eines Tooltips die ganze Meldung (Spielbreicht, etc.) einblenden kann.
Hatte das zuerst einmal mit HTML und CSS-Formatierung versucht, hatte dann aber das Problem, dass ich in diesen Tooltip keine weiterführenden Links einbauen konnte.
Daraufhin habe ich im Internet eine Möglichkeit gefunden, das selbe auch mit JavaScript zu erreichen und soweit ich es bisher beurteilen kann, klappt das auch.
Jetzt habe ich nur 2 Probleme:
1. Wie erreiche ich es, dass der Tooltip nach dem "mouseout" noch etwas länger eingeblendet wird? Schließlich nützt es mir ja wenig, wenn ich einen Link in dem Tooltip habe, diesen aber nie anklicken kann, weil der Tooltip sofort verschwindet!
2. Bisher hängt der Tooltip am Mauszeiger. Mir wäre es aber lieber, wenn er am Trigger-Wort (klassischer Weise das Wörtchen "mehr") positioniert wäre, halt so, dass der rechte Rand des Tooltips gleichauf ist, mit dem rechten Ende des Trigger-Wortes.
Hier mal die entsprechende Stelle im Quelltext:
<style>
<!--
.tooltip1 {
position: absolute;
display: none;
background-color: #FDFFB2;
z-index: 100;
top: 30px;
right: 0px;
width: 200px;
max-width: 500px;
color: #000000;
border: 1px solid;
border-color: #000000;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
padding: 2px 10px 2px 10px;
font-size: smaller;
font-family: Arial, Helvetica, Sans-serif;
}
-->
</style>
<script type="text/javascript">
<!--
wmtt = null;
document.onmousemove = updateWMTT;
function showWMTT(id) {
wmtt = document.getElementById(id);
wmtt.style.display = "block";
}
function hideWMTT() {
wmtt.style.display = "none";
}
-->
</script>
<div id="1" class="tooltip1">Dies ist unser erster Tooltip<img src="URL"><br /><a href="URL">Link</a></div>
[...]
<a onmouseover="showWMTT('1')" onmouseout="hideWMTT()" href="#">Unser Link</a>
Vielen Dank schonmal für die Hilfe,
Kingpin