Mouse-over-effekt Dreamweaver
0 
Andy
0
Mouse-over-effekt Dreamweaver
Hallöchen!
Ich beschäftige mich erst seit ein wenigen Wochen mit dem verfassen von Internetseiten, da ich, mangels fähigen Freiwilligen, die Neugestaltung der HP unseres Sportvereins übernommen habe.
Nun folgendes:
Ich habe die neue Seite online und würde in meiner Navigationsleiste gerne einen mouse-over-Effekt einbinden, so dass bei onmouse-over auf einem Navigationsfeld ein zusätzliches Feld erscheint, wie z.B. hier: www.endlagerung.de in dem ich weitere Links einbinden kann.
Da ich mit Dreamweaver 8 arbeite meine Frage: Gibt es ein Fertigrezept in diesem Programm oder wie muss ich vorgehen? Nach einem googeln habe ich gelesen, dass es z.B. beim Farbwechseln von Schaltern über einzelne Bilder (jpeg) läuft. Ist das in diesem Fall auch so?
Dank im Voraus !
-
-
Hallöchen!
Danke für den Hinweis, die beiden Erklärungen bin ich mal durchgegangen auch wenn sie für mich nicht ausführlich genug waren.
Habe jetzt mal weiter gestöbert und eine erste Ebene mit mouseover und mouseout erstellt.Doch leider passiert nichts. Ich hänge mal meinen Code des betreffenden frames an und wäre für jeden eurer Tips dankbar.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
.Stil1 {
font-size: 48px;
font-family: "Times New Roman", Times, serif;
color: #333333;
}
.Stil2 {font-size: 42px}
.Stil3 {font-family: "Times New Roman", Times, serif}
.Stil5 {font-family: "Times New Roman", Times, serif; font-size: 18px; }
.Stil8 {font-size: 16px}
.Stil10 {font-size: 17px}
.Stil11 {font-family: "Times New Roman", Times, serif; font-size: 17px; }
a {
font-family: Times New Roman, Times, serif;
font-size: 17px;
}
body,td,th {
font-size: 17px;
color: #000000;
}
a:link {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #333333;
}
a:hover {
text-decoration: none;
color: #999999;
}
a:active {
text-decoration: none;
color: #999999;
}
.Stil16 {color: #006600}
.Stil17 {font-size: 18px; font-weight: bold; color: #006600; }
.Stil18 {font-size: 17px; color: #006600; }
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
top: 194px;
left: 387px;
visibility: visible;
}
#Layer2 {
position:absolute;
width:200px;
height:115px;
z-index:2;
left: 422px;
top: 191px;
overflow: auto;
}
.Stil19 {color: #006600; font-size: 18px;}
#Tennisanlage {
position:absolute;
width:133px;
height:78px;
z-index:1;
left: 103px;
top: 192px;
background-color: #CCCCCC;
visibility: hidden;
}
.Stil22 {font-family: "Times New Roman", Times, serif; font-size: 17px; color: #000000; }
-->
</style>
</head><body>
<div align="center">
<table width="90%" border="0">
<tr>
<td width="210"><a href="Aktuelles/Aktuelles.html" target="mainFrame"><img src="Dateien/logo_tennisfreunde.JPG" width="205" height="152" border="0" /></a></td>
<td width="702" align="center" valign="bottom"><span class="Stil1">T<span class="Stil2">ENNISFREUNDE</span> <span class="Stil16">W<span class="Stil2">ULFEN</span></span> e.V. </span></td>
</tr>
</table>
</div>
<table width="90%" border="0">
<tr>
<td width="108" align="center" valign="middle"><span class="Stil5"><span class="Stil16"><strong> A</strong><span class="Stil8"><a href="Aktuelles/Aktuelles.html" target="mainFrame">KTUELLES</a> </span></span></span></td>
<td width="91" align="center" valign="middle" class="Stil3"><span class="Stil17"><span class="Stil3">T</span></span>
<div id="Tennisanlage" style="position: absolute; top: 207px; width: 100px; z-index: 1; left: 106px;" onmouseover="setOnLayer(true,'Tennisanlage')" onmouseout="setOnLayer(false,'Tennisanlage')">
<p align="left" class="Stil3">ANFAHRT<br />
ROUTENPLANER
ADRESSE<br />
TENNISPLAETZE <br />
</p>
</div>
<span class="Stil19"><span class="Stil22">ENNISANLAGE</span></span></td>
<td width="158" align="center" valign="middle" class="Stil3"><span class="Stil17">T</span><span class="Stil19"><span class="Stil18"><a href="Termine/Termine.html" target="mainFrame">ERMINE</a></span></span></td>
<td width="151" align="center" valign="middle"><span class="Stil3"><span class="Stil17">M</span><span class="Stil10"><a href="Mannschaften/Mannschaften.html" target="mainFrame">ANNSCHAFTEN</a></span></span><span class="Stil3"><span class="Stil10"> </span></span></td>
<td width="90" align="center" valign="middle"><div align="left"><span class="Stil17">T</span><a href="Training/Training.html" target="mainFrame">RAINING </a></div></td>
<td width="139" align="center" valign="middle"><div align="left" class="Stil3"><span class="Stil17">M</span><span class="Stil19"><span class="Stil10"><a href="Mitgliedschaft/Mitgliedschaft.html" target="mainFrame">ITGLIEDSCHAFT</a></span></span></div></td>
<td width="71" align="center" valign="middle"><div align="left"><span class="Stil11"><span class="Stil17">C</span><a href="Chronik/Chronik.html" target="mainFrame">HRONIK</a></span></div></td>
<td width="76" align="center" valign="middle"><div align="left"><span class="Stil11"><span class="Stil17">P</span><a href="Photo-Menue/Photo-Menue.html" target="mainFrame">HOTOS</a></span></div></td>
<td width="100" align="center" valign="middle"><div align="left"><span class="Stil11"><span class="Stil17">V</span><a href="Vorstand/Vorstand.html" target="mainFrame">ORSTAND</a></span></div></td>
<td width="120" align="center" valign="middle"><div align="left"><span class="Stil11"><span class="Stil17">G</span><a href="Gaestebuch/Gaestebuch.html" target="mainFrame">AESTEBUCH</a></span></div></td>
</tr>
</table>
</body>
</html>