Hi Profis,
ich habe in meinem Blog (OpenSuse-lernen.de » Allgemeines)ein Script verwendet, dass einzelne Wörter oder Wortgruppen hervorhebt und wenn man den Mauszeiger draufhält bekommt man einen vorgefertigten Tooltipp angezeigt. Kennt sicherlich jeder. :)
Nun funktionierte das Script bei meiner vorherigen "normalen" html-Seite einwandfrei. Es funktioniert auch mit Wordpress. Das Problem ist nur:
außer der InternetExplorer setzen alle anderen Browser den Tooltipp viel zu weit vom Mauszeiger weg. Beim InternetExplorer steht der Tooltipp mit einer Ecke dicht am Mauszeiger.
Ich habe die Zeilen :
wmtt.style.left = (x + 20) + "px";
wmtt.style.top = (y + 20) + "px";aus dem Headercode verändert. Hat aber nichts gebracht. Mich verwirrt aber auch, warum Wordpress trotz der richtigen Angaben es anders anzeigt.
hier mal der Code aus dem header:
<style type="text/css">
.tooltip {
position: absolute;
display: none;
background-color: #FFFFFF;
}
.tooltip2 {
position: absolute;
display: none;
background-color: #FFFFFF;
border-width: 1px;
border-style: solid;
border-color: #000000;
padding: 2px;
}
.tooltip2 .head{
background-color: #52ac09;
color: white;
font-weight: bold;
padding: 2px;
}
.tooltip2 .content{
color: 000066;
font-size: 11px;
border-size: 4px;
}
.tooltip2 .content td{
width: 50%;
font-size: 11px;
text-align: center;
}
</style>
<script>
<!--
wmtt = null;
document.onmousemove = updateWMTT;
function updateWMTT(e) {
x = (document.all) ? window.event.x + document.body.scrollLeft : e.pageX;
y = (document.all) ? window.event.y + document.body.scrollTop : e.pageY;
if (wmtt != null) {
wmtt.style.left = (x + 20) + "px";
wmtt.style.top = (y + 20) + "px";
}
}
function showWMTT(id) {
wmtt = document.getElementById(id);
wmtt.style.display = "block"
}
function hideWMTT() {
wmtt.style.display = "none";
}
//-->
</script>und auch noch mal hier der Code der im Body dann am Wort steht:
<a onmouseover="showWMTT('6')" onmouseout="hideWMTT()"><span style="background: rgb(251, 250, 148) none repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial;">
Virtual Box 1.5.6</span></a>Ich wäre dankbar für jeden Tipp, denn es ist mir wichtig, das es besonders im Firefox richtig angezeigt wird.
Gruß Karly