[GastForen Programmierung/Entwicklung JavaScript Nav mit MouseOver

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

Nav mit MouseOver

Anonym
Beiträge gesamt: 22827

15. Jul 2003, 21:56
Beitrag # 1 von 4
Bewertung:
(953 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo erstmal,
folgendes Prob stellt sich dar. Wenn ich über mein Menu gehe, arbeitet es wie vorgesehen bis auf die winzige Kleinigkeit, daß das Menu nach dem MouseOut nicht in die Urstellung zurückgeht... "Function Clean()"...

UND HIER DAS SCRIPT:


<script language="JavaScript">

function clean ()
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt (0)<'5'))
{
window.document.b.visibility="hide";
window.document.m1.visibility="hide";
window.document.m2.visibility="hide";
window.document.m3.visibility="hide";
window.document.h1a.visibility="hide";
window.document.h2a.visibility="hide";
window.document.h3a.visibility="hide"
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='hidden';
layers[2].style.visibility='hidden';
layers[4].style.visibility='hidden';
layers[6].style.visibility='hidden';
layers[7].style.visibility='hidden';
layers[8].style.visibility='hidden';
layers[9].style.visibility='hidden';
return;
}

function menu (i)
{

switch(i)
{
case 1:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="show";
window.document.m2.visibility="hide";
window.document.m3.visibility="hide";
window.document.h1a.visibility="show";
window.document.h2a.visibility="hide";
window.document.h3a.visibility="hide"
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='visible';
layers[4].style.visibility='hidden';
layers[6].style.visibility='hidden';
layers[7].style.visibility='visible';
layers[8].style.visibility='hidden';
layers[9].style.visibility='hidden';
return;
}
case 2:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="hide";
window.document.m2.visibility="show";
window.document.m3.visibility="hide";
window.document.h1a.visibility="hide";
window.document.h2a.visibility="show";
window.document.h3a.visibility="hide"
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='hidden';
layers[4].style.visibility='visible';
layers[6].style.visibility='hidden';
layers[7].style.visibility='hidden';
layers[8].style.visibility='visible';
layers[9].style.visibility='hidden';
return;
}

case 3:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="hide";
window.document.m2.visibility="hide";
window.document.m3.visibility="show";
window.document.h1a.visibility="hide";
window.document.h2a.visibility="hide";
window.document.h3a.visibility="show"
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='hidden';
layers[4].style.visibility='hidden';
layers[6].style.visibility='visible';
layers[7].style.visibility='hidden';
layers[8].style.visibility='hidden';
layers[9].style.visibility='visible';
return;
}
}

}
</script>
</head>
<body bgcolor="#dfdfdf" background="img/banner_back.jpg" onload="preload_start()">
<div id="b" style="position:absolute; left:0; top:14px; width:500px; height:90px; z-index:1; visibility: hidden;">
<a href="#" onmouseout="clean()"></a>
</div>

<div id="h1" style="position:absolute; left:40px; top:20px; width:73px; height:25px; z-index:2; visibility: visible;">
<a href="#" target="topFrame1" class="navbar" onmouseover="menu(1)">Allgemeines</a>
</div>

<div id="m1" style="position:absolute; left:40px; top:44; width:242; height:55px; z-index:3; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;" >
<table width="100%" height="100%" cellspacing="0">
<tr>
<td valign="middle" class="navbarthemes"><img src="img/menupoint.gif" width="12" height="4" hspace="2" border="0" align="absmiddle">
<a href="zielsetzung.htm" target="mainFrame" class="navbarthemes">Zielsetzung</a></td>
</tr>
<tr>
<td valign="middle" class="navbarthemes"><img src="img/menupoint.gif" width="12" height="4" hspace="2" border="0" align="absmiddle">
<a href="profil.htm" target="mainFrame" class="navbarthemes">Profil</a></td>
</tr>
<tr>
<td valign="middle" class="navbarthemes"><img src="img/menupoint.gif" width="12" height="4" hspace="2" border="0" align="absmiddle">
<a href="../../tmp/php/snews/inhalt.php" target="mainFrame" class="navbarthemes">
News</a></td>
</tr>
</table>
</div>

<div id="h2" style="position:absolute; left:153px; top:20px; width:129px; height:25px; z-index:4; visibility: visible;">
<a href="#" class="navbar" onmouseover="menu(2)">Homepage-Zubeh&ouml;r</a> </div>

<div id="m2" style="position:absolute; left:40px; top:44px; width:327px; height:55px; z-index:5; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;">
<table width="100%" height="100%" cellspacing="0">
<tr valign="middle" class="navbarthemes">
<td width="50%" height="2"><span class="inhaltsauswahl"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
</span><a href="menuframe_anigif.htm" target="leftFrame" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/anigifseinleitung.htm';parent.topFrame2.location='../htms/auswahl_anigifs.htm' ; return false;">AniGifs</a></td>

<td width="50%"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/aufbau.htm';parent.topFrame2.location='../htms/info.htm' ; return false;">Java
Scripte</a></td>
</tr>

<tr valign="middle" class="navbarthemes">
<td height="2"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/aufbau.htm';parent.topFrame2.location='../htms/info.htm' ; return false;">Gifs</a></td>

<td><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="menuframe_php.htm" target="leftFrame" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/phpeinleitung.htm';parent.topFrame2.location='../htms/auswahl_php.htm' ; return false;">PHP
Scripte</a></td>
</tr>

<tr valign="middle" class="navbarthemes">
<td height="2"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/fertigedesigns.htm';parent.topFrame2.location='../htms/info.htm' ; return false;">fertige
Designs</a></td>

<td><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="" class="navbarthemes" onClick="parent.topFrame1.location='#';parent.mainFrame.location='../htms/gb.htm';parent.topFrame2.location='../htms/info.htm' ; return false;">G&auml;steb&uuml;cher</a></td>
</tr>
</table>
</div>

<div id="h3" style="position:absolute; left:315px; top:20px; width:52px; height:25px; z-index:6; visibility: visible;">
<a href="#" class="navbar" onMouseOver="menu(3)">Support</a> </div>

<div id="m3" style="position:absolute; left:153px; top:44px; width:214px; height:55px; z-index:7; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;">
<table width="100%" height="100%" cellspacing="0">
<tr valign="middle" class="navbarthemes">
<td width="50%"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="#" class="navbarthemes" ONCLICK="window.open('../htms/mailform.htm', 'x','toolbar=no,alwaysRaised=yes,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,copyhistory=no,width=600,height=480')">Kontakt</a></td>
<td width="50%"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="menuframe_service.htm" target="leftFrame" class="navbarthemes">Service-Bereich
</a></td>
</tr>
<tr valign="middle" class="navbarthemes">
<td colspan="2"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="#" class="navbarthemes" onClick="window.open('../../tmp/php/guest/jgb.php', 'x','toolbar=no,alwaysRaised=yes,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,copyhistory=no,width=690,height=480')">G&auml;stebuch</a>
</td>
</tr>
<tr valign="middle" class="navbarthemes">
<td colspan="2"><img src="img/menupoint.gif" width="12" height="4" hspace="2" align="absmiddle">
<a href="#" class="navbarthemes" ONCLICK="window.open('../../tmp/php/bb2/index.php', 'x','toolbar=no,alwaysRaised=yes,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,copyhistory=no,width=800,height=600')">Forum</a></td>
</tr>
</table>
</div>

<div id="h1a" style="position:absolute; left:40px; top:20px; width:73px; height:25px; z-index:8; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;">
<a href="#" target="topFrame1" class="navbar" onMouseOver="menu(1)">Allgemeines</a>
</div>
<div id="h2a" style="position:absolute; left:153px; top:20px; width:130px; height:25px; z-index:9; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;">
<a href="#" class="navbar" onmouseover="menu(2)">Homepage-Zubeh&ouml;r</a> </div>

<div id="h3a" style="position:absolute; left:315px; top:20px; width:52px; height:25px; z-index:10; visibility: hidden; background-color: #333333; layer-background-color: #333333; border: 1px none #000000;">
<a href="#" class="navbar" onMouseOver="menu(3)">Support</a> </div>

</body>



Für eure Hilfe wäre ich dankbar...

trinity2253
X

Nav mit MouseOver

Megabyte
Beiträge gesamt: 134

21. Jul 2003, 18:04
Beitrag # 2 von 4
Beitrag ID: #44511
Bewertung:
(953 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Ich schau mal nach :D


als Antwort auf: [#43896]

Nav mit MouseOver

Megabyte
Beiträge gesamt: 134

21. Jul 2003, 18:13
Beitrag # 3 von 4
Beitrag ID: #44514
Bewertung:
(953 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
hmm... Switch ohne break... mal schaun ob das nun was nützt
Hmm ständig wird "Script Fehler" angezeigt!
Ich hab jedenfalls noch ein paar fehler gefunden, die dir aber leider nicht weiterhelfen:
Bei den Links ist der Name der Funktion anders als im head (z.B. clean() anstatt clean ())
Ansonsten untersuch den Script mal auf die Schleifen. Ich glaub dass da was nicht stimmt...


als Antwort auf: [#43896]
(Dieser Beitrag wurde von Megabyte am 21. Jul 2003, 18:26 geändert)

Nav mit MouseOver

Megabyte
Beiträge gesamt: 134

28. Jul 2003, 19:29
Beitrag # 4 von 4
Beitrag ID: #45326
Bewertung:
(953 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
HI!
Ich habe mal das ganze mal stark gekürzt, damit du verstehst wie das Schematisch funtioniert:

<HTML>
<head>
<script language="JavaScript">

function clean()
{
h1.style.visibility='visible';
h2.style.visibility='visible';
h3.style.visibility='hidden';
}

function menu()
{
h1.style.visibility='visible';
h2.style.visibility='visible';
h3.style.visibility='visible';
}

</script>
</head>
<body bgcolor="#dfdfdf" background="img/banner_back.jpg" onload="clean()">
<div id="h1" style="position:absolute; left:0; top:14px; width:500px; height:90px; z-index:1; visibility: hidden;" >
</div>

<div id="h2" style="position:absolute; left:40px; top:20px; width:73px; height:25px; z-index:2; visibility: visible;">
<a href="#" target="topFrame1" class="navbar" onmouseover="menu()" onmouseout="clean()">Allgemeines</a>
</div>

<div id="h3" style="position:absolute; left:40px; top:40px; width:73px; height:25px; z-index:3; visibility: visible;">
<a href="#" target="topFrame1" class="navbar" onmouseover="menu()" onmouseout="clean()">Menu Punkt1</a>
</div>

</body>

Ich hoffe, dass es dir weiterhilft - du kannst die sachen ja mit CSS weiter ausbauen :D


P.s. vielleicht sollte man die eben nicht h1 und so ähnlich nennen - das sind ja auch HTML Tags... vielleicht denkt der dann, dass er den Tag h1 dementsprechend verändern soll


als Antwort auf: [#43896]
(Dieser Beitrag wurde von Megabyte am 28. Jul 2003, 19:31 geändert)
X

Aktuell

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
27.01.2021 - 28.01.2021

Digicomp Academy AG, Bern oder Basel
Mittwoch, 27. Jan. 2021, 08.30 Uhr - Donnerstag, 28. Jan. 2021, 17.00 Uhr

Kurs

Mit After Effects können Sie visuelle Effekte und Animationen für Video, Web, DVD und Blu-Ray erzeugen. In diesem Kurs lernen Sie die Grundlagen kennen und sehen inspirierende Anwendungsbeispiele, die Ihnen helfen, Ihre eigenen Ideen umzusetzen.

Preis: CHF 1'700.-
Dauer: 2 Tage

Ja

Organisator: Digicomp Academy AG

Kontaktinformation: Kundenberater-Team, E-Mailkundenberatung AT digicomp DOT ch

digicomp.ch/d/AFT

Veranstaltungen
01.02.2021 - 02.02.2021

Digicomp Academy AG, Zürich oder virtuell
Montag, 01. Feb. 2021, 08.30 Uhr - Dienstag, 02. Feb. 2021, 17.00 Uhr

Kurs

In diesem Basic-Kurs lernen Sie das Wichtigste über den Aufbau und die Funktionsweise von Photoshop. Zusammen mit den notwendigen Grundlagen von Farbenlehre bis Bildauflösung lernen Sie zudem die kreativen Möglichkeiten von Photoshop kennen.

Dauer: 2 Tage
Preis: CHF 1'400.–

Ja

Organisator: Digicomp Academy AG

Kontaktinformation: Kundenberater-Team, E-Mailkundenberatung AT digicomp DOT ch

digicomp.ch/d/PHOTM1

Neuste Foreneinträge


Videos ausschneiden/zusammenfügen

Summewenn Funktion in Filemaker

Hyperlink aus PDF werden nicht erkannt

Feld in Acrobat vor Berechnung leer lassen

Gleich Große Icons erstellen

InDesign Datei mit Kurzgeschichten in einem Rahmen auf mehrere Dateien aufteilen

Text- oder Grafikrahmen nach Position und Größe suchen und ändern

Absätze vor/nach AF suchen

Laser Drucker druckt schwarze Flecken Links und Rechts von Blatt

PSD CS6 (!) Mac: Dialog "Dateiinformationen" Fenster leer und Sackgasse
medienjobs