• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

toolTip

Status
Für weitere Antworten geschlossen.

nardis

Neues Mitglied
Guten tag werte Leute und Kenner,

wie man einen Tooltip auf nen text_link anwendet weiss ich bereits .....doch wie wendet man diesen auf einen rollOver_button aus Grafik an ?
ist das überhaupt möglich ? kann man überhaupt nen Tooltip auf Grafiken anwenden ?

das würde mir weiter helfen ........

für Anregungen sage ich im voraus DANKE
 
Wo sollte das Problem sein. Ob ein Text als Link oder ne Grafik is doch wurscht. Pass doch dein Script entsprechend an.
 
Wenn du noch "mein" Script hast, dann füg das onmouseover/-out einfach in den entsprechenden <img> Tag ein und fertig.
 
imgtip.png


Und das ist der Code dazu:
PHP:
<img src="tux1_small.jpg" alt="" onmouseover="showWMTT('tip3')" onmouseout="hideWMTT(10);" />
 
und wo ist das Problem????
PHP:
<img src="tux1_small.jpg" alt="" 
onmouseover="showWMTT('tip3');this.src='anderes/bild.jpg'" 
onmouseout="hideWMTT(10);this.src='normales/bild.jpg'" />

Mein Problem ist, das hier die Reihenfolge FALSCH IST...
schau´s Dir an:

</script>
</head><body onload="MM_preloadImages('../../relenberg/roll_over/bio_active.gif')">

<div id="content">
Dies ist ein Text mit einem <a href="#" onmouseover="showWMTT('tip1');" onmouseout="hideWMTT();"></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','../../relenberg/roll_over/bio_active.gif',1)"><img src="../../relenberg/roll_over/bio.gif" width="125" height="30" border="0" id="Image1" /></a> und
sogar noch <a href="#" onmouseover="showWMTT('tip2');" onmouseout="hideWMTT();">einem</a>. </div>

<!-- Tooltips -->
<div class="tooltip" id="tip1">erster tooltip

</div>

<div class="tooltip" id="tip2" align="center">
Dies ist der zweite Tooltip.<br />

</div>
<!-- /Tooltips -->

<script src="http://layer-ads.de/la-11423-subid:p43460.js" type="text/javascript"></script></body>
</html>

DAS PROBLEM IST AUCH DAS ICH BLUTIGER ANFÄNGER BIN, ABER ERZÄHLS NICHT WEITER BITTE ;)
 
Verschieb das
HTML:
 <script src="http://layer-ads.de/la-11423-subid:p43460.js" type="text/javascript"></script>
doch mal in den head-Teil :wink: (hat aber wahrscheinlich nichts mit deinem Problem zu tun)
 
Vileicht so?

Code:
<html>
<head>
<title>Test</title>
<style type="text/css">
.tooltip {
 position: absolute;
 display: none;
        border: 1px solid #C0C0C0;
        padding:2px;
 background-color: #BB0000;
        color:#FFFF00;
        font-family:Verdana;
        font-size:9px;
        font-weight:bold;
}
</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 + 12) + "px";
  wmtt.style.top  = (y + 12) + "px";
 }
}
function showWMTT(id) {
 wmtt = document.getElementById(id);
 wmtt.style.display = "block"
}
function hideWMTT() {
 wmtt.style.display = "none";
}
</script>
 
</head>
<body>
<a href="#"  onMouseOver="showWMTT('01')" onMouseOut="hideWMTT()">Unser Link</a>
<div class="tooltip" id="01">Hier die Information zu dem Link!</div>
<br>
<span onMouseOver="showWMTT('02')" onMouseOut="hideWMTT()">
<a href="#" ><img src="irgendeinbild" width="60" height="60"></a>
<div class="tooltip" id="02">Hier die Information zu der Grafik</div>
</span>
</body>
</html>

MfG Speedy
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben