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

wie mach ich ein moseover wie da:

Status
Für weitere Antworten geschlossen.
Also wie im Menü kannst du mit CSS machen, den aber mit dem anderem Zeug da nur mit JS.
Welchen meinst du?

Bastian
 
das wo die vielen viereckigen bilder sind

wie ich das amchen muss

währe echt nett wenn du mir dabei helfen könntest
 
sowas nennt man tooltip übrigens ;)

hier is mal en skript wie das aussehen könnte, das kannst du dir ja einfach kopieren und so anpassen wie du es brauchst :)

HTML: 
<html>
<head>
<style type="text/css">
<!--
.ToolTipTitel {
 color: black;
 font-family: arial, sans-serif;
 font-weight: bold;
 font-size: 10pt;
}

.ToolTipInhalt {
 color: black;
 font-family: arial, sans-serif;
 font-size: 10pt;
}

#ToolTip {
 position:absolute;
 width: 100px;
 top: 0px;
 left: 0px;
 z-index: 4;
 visibility: hidden;
}
-->
</style>
<script language="javascript">
<!--
var Initialisierung = 0
var Ex, Ey, TitelFarbe, TextFarbe, ContentInfo;

TitelFarbe = "red"
TextFarbe = "yellow"


function ToolTipBewegen(layerName, FromTop, FromLeft, e)
{
    document.getElementById(layerName).style.top = FromTop;
    document.getElementById(layerName).style.left = FromLeft + 15;
}

function Aktivieren()
{
    Initialisierung=1;
}

function Deaktivieren()
{
    Initialisierung=0;
}

function Starten(e)
{
    if(Initialisierung)
    {
        Ex = document.all ? window.event.x : e.pageX;
        Ey = document.all ? window.event.y : e.pageY;
        ToolTipBewegen("ToolTip", Ey, Ex, e);
        document.getElementById('ToolTip').style.visibility = "visible";
    }
    else
    {
        ToolTipBewegen("ToolTip", 0, 0);
        document.getElementById('ToolTip').style.visibility = "hidden";
    }
}

function ToolTip(layerName, TTitel, TInhalt)
{
    ContentInfo = '<table border="0" width="150" cellspacing="0" cellpadding="0">'+'<tr><td width="100%" bgcolor="#000000">'+'<table border="0" width="100%" cellspacing="1" cellpadding="0">'+'<tr><td width="100%" bgcolor='+TitelFarbe+'>'+'<table border="0" width="90%" cellspacing="0" cellpadding="0" align="center">'+'<tr><td width="100%">'+'<font class="ToolTipTitel"> '+TTitel+'</font>'+'</td></tr>'+'</table>'+'</td></tr>'+'<tr><td width="100%" bgcolor='+TextFarbe+'>'+'<table border="0" width="90%" cellpadding="0" cellspacing="1" align="center">'+'<tr><td width="100%">'+'<font class="ToolTipInhalt">'+TInhalt+'</font>'+'</td></tr>'+'</table>'+'</td></tr>'+'</table>'+'</td></tr>'+'</table>';
    document.getElementById(layerName).innerHTML = ContentInfo;
}
//-->
</script>
</head> 

<body onmousemove="Starten(event);">
<div id="ToolTip"></div>

<a href="#" onMouseover="ToolTip('ToolTip','Titel des Tool-Tips','Hier können Sie beliebigen Text <i>inkl. HTML-Tags</i> notieren.'); Aktivieren();" onMouseout="Deaktivieren();">Fahren Sie zum Testen des Tool-Tips über diesen Text.</a>

</body>


</html>
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben