WinFuture-Forum.de: Dropdownmenü Funktioniert Nicht? Es Spielt Total Verrückt! - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
Seite 1 von 1

Dropdownmenü Funktioniert Nicht? Es Spielt Total Verrückt!


#1 Mitglied ist offline   ps915 

  • Gruppe: aktive Mitglieder
  • Beiträge: 1.119
  • Beigetreten: 17. Mai 07
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 06. März 2008 - 20:14

Ich bin gearde dabei ein kleines Dropdownmenü zu schriebn, nur jetzt komme ich nicht emhr weiter....

Wenn ich über buton y hover öffnet aber menü x.
Ich hab alles überprüft nur ich kanns mir nich erklären....

Hoffe jemand findet den Fehler...

Zum kaputten Dropdownmenü!

Quellcode von index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>decorative menu</title>
<link rel="stylesheet" type="text/css" media="screen, print"  href="required/decomenu.css" />
<script type="text/javascript"  src="required/popmenu.js"></script>
</head>
<body>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>
<div id="menubox">
  <div id="shopb"><a  href="shop.html"  title="shop" onmouseout="P2H_StartClock();" onmouseover="P2H_Menu('PMshopb', 500, 0);"></a></div>
  <div id="shopmenu" class="PMshopb">
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
  </div>
  <div id="galleryb"><a  href="gallery.html"  title="gallery" onmouseout="P2H_StartClock();" onmouseover="P2H_Menu('PMgalleryb', 500, 0);"></a></div>
  <div id="gallerymenu" class="PMgalleryb">
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
  </div>
  <div id="contactb"><a  href="contact.html"  title="contact" onmouseout="P2H_StartClock();" onmouseover="P2H_Menu('PMcontactb', 500, 0);"></a></div>
  <div id="contactmenu" class="PMcontactb">
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
  </div>
  <div id="phil"><a  href="phil.html"  title="phil" onmouseout="P2H_StartClock();" onmouseover="P2H_Menu('PMphil', 500, 0);"></a></div>
  <div id="philmenu" class="PMphil">
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
	<p class="link"><a href="#" onmouseout="P2H_StartClock();" onmouseover="P2H_MenuItem(1);">Link</a></p>
	<p class="line">. . .</p>
  </div>
</div>
  
</body>
</html>



Hier der Quelltext vom der css:
/* layout */
html  {
   margin: 0px;
   height: 100%;
}
body  {
   margin: 0px;
   background-color: #202020;
}
#outerperimeter {
	background-color: transparent;
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0px auto 0px auto;
	padding: 0px;
}
#innerperimeter {
	background-color: transparent;
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0px auto 0px auto;
	padding: 0px;
}
#menubox  {
	background-color: transparent;
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 1;
	width: 600px;
	height: 50px;
	margin: 20px auto 0px auto;
	padding: 0px;
}
/* end layout */

/* shop nav */
#shopb  {
   position: absolute;
   left: 16px;
   top: 19px;
   z-index: 3;
   width: 89px;
   height: 29px;
}
#shopb a  {
   background: url(../images/home.png) no-repeat;
   display: block;
   height: 29px;
   width: 89px;
   background-position: 0% 0px;
}
#shopb a:hover  {
   background-position: -89px 0%;
}
#shopmenu  {
   background: url(../images/bg-popup.png) no-repeat;
   visibility: hidden;
   position: absolute;
   left: 17px;
   top: 43px;
   z-index: 5;
   width: 87px;
   height: 99px;
   padding-top: 10px;
}
/* end shop nav */

/* gallery nav */
#galleryb  {
   position: absolute;
   left: 107px;
   top: 19px;
   z-index: 3;
   width: 89px;
   height: 29px;
}
#galleryb a  {
   background: url(../images/fotos.png) no-repeat;
   display: block;
   height: 29px;
   width: 89px;
   background-position: 0% 0px;
}
#galleryb a:hover  {
   background-position: -89px 0%;
}
#gallerymenu  {
   background: url(../images/bg-popup.png) no-repeat;
   visibility: hidden;
   position: absolute;
   left: 107px;
   top: 43px;
   z-index: 5;
   width: 87px;
   height: 99px;
   padding-top: 10px;
}
/* end gallery nav */

/* contact nav */
#contactb  {
   position: absolute;
   left: 196px;
   top: 19px;
   z-index: 3;
   width: 89px;
   height: 29px;
}
#contactb a  {
   background: url(../images/contact.png) no-repeat;
   display: block;
   height: 29px;
   width: 89px;
   background-position: 0% 0px;
}
#contactb a:hover  {
   background-position: -89px 0%;
}
#contactmenu  {
   background: url(../images/bg-popup.png) no-repeat;
   visibility: hidden;
   position: absolute;
   left: 197px;
   top: 43px;
   z-index: 5;
   width: 87px;
   height: 99px;
   padding-top: 10px;
}
/* end contact nav */

/* phil nav */
#phil  {
   position: absolute;
   left: 287px;
   top: 19px;
   z-index: 3;
   width: 89px;
   height: 29px;
}
#phil a  {
   background: url(../images/phil.png) no-repeat;
   display: block;
   height: 29px;
   width: 89px;
   background-position: 0% 0px;
}
#phil a:hover  {
   background-position: -89px 0%;
}
#philmenu  {
   background: url(../images/bg-popup.png) no-repeat;
   visibility: hidden;
   position: absolute;
   left: 107px;
   top: 43px;
   z-index: 5;
   width: 87px;
   height: 99px;
   padding-top: 10px;
}
/* end phil nav */


/* link controls */
p.link {
   font: normal normal 10px/10px "Mini 7 Tight";
   padding: 0px;
   margin: 0px;
   color: #FFFFFF;
   text-align: center;
}

p.line {
   font: normal normal 10px/6px "Mini 7 Tight";
   padding: 0px 0px 5px 0px;
   margin: 0px;
   color: #FFFFFF;
   text-align: center;
}

a:link, a:visited  {
   font: normal normal 10px/10px "Mini 7 Tight";
   color: #FFFFFF;
   text-decoration: none;
}

a:hover, a:active  {
   font: normal normal 10px/10px "Mini 7 Tight";
   color: #999999;
   text-decoration: none;
}
/* end links */

#menutext {
	background-color: transparent;
	position: relative;
	top: 60px;
	left: 0px;
	z-index: 1;
	width: 260px;
	height: 120px;
	margin: 0px auto 0px auto;
	padding: 0px;
}
#menutext p {
   font: normal normal 10px/10px "Mini 7 Tight";
   padding: 0px;
   margin: 0px;
   color: #FFFFFF;
   text-align: left;
}

Eingefügtes Bild
Deutsches Raspberry Pi Forum
Ein vollwertige Linuxbox mit Ethernet, Hdmi und USB in der Größe einer Kredidkarte für knapp 30 Euro!
0

Anzeige



#2 Mitglied ist offline   Witi 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.947
  • Beigetreten: 13. Dezember 04
  • Reputation: 43
  • Geschlecht:Männlich
  • Wohnort:Kingsvillage
  • Interessen:Frickeln

geschrieben 06. März 2008 - 21:01

Zitat

#gallerymenu {
background: url(../images/bg-popup.png) no-repeat;
visibility: hidden;
position: absolute;
left: 107px;
top: 43px;
z-index: 5;
width: 87px;
height: 99px;
padding-top: 10px;
}

#philmenu {
background: url(../images/bg-popup.png) no-repeat;
visibility: hidden;
position: absolute;
left: 107px;
top: 43px;
z-index: 5;
width: 87px;
height: 99px;
padding-top: 10px;
}


Ich muss dir aber hoffentlich nicht sagen, dass das Menü - sagen wir mal - alles andere als toll ist.
Sowas kannste auch ohne JavaScript, direkt in HTML machen.
[email protected] 0xAAE321A2

50226 - Witis Blog
0

#3 Mitglied ist offline   ps915 

  • Gruppe: aktive Mitglieder
  • Beiträge: 1.119
  • Beigetreten: 17. Mai 07
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 06. März 2008 - 21:40

hm... also du ahst den fehler nich gefunden? schade! also ich wüsste jezt net wie ich das in html machen sollte..... :-(
Eingefügtes Bild
Deutsches Raspberry Pi Forum
Ein vollwertige Linuxbox mit Ethernet, Hdmi und USB in der Größe einer Kredidkarte für knapp 30 Euro!
0

#4 Mitglied ist offline   ps915 

  • Gruppe: aktive Mitglieder
  • Beiträge: 1.119
  • Beigetreten: 17. Mai 07
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 06. März 2008 - 22:24

Ich muss dir zustimmen.. das ist wirklich einfach in HTML, vorallem übersichtlicher geworden.
Ich habe aber trotzdem ein bisschen javascript eingebaut.

Wenn die maus das Dropdownmenü verlässt, schließt es sich.

Bin aber ganz zufrieden damit! ^_^
Eingefügtes Bild
Deutsches Raspberry Pi Forum
Ein vollwertige Linuxbox mit Ethernet, Hdmi und USB in der Größe einer Kredidkarte für knapp 30 Euro!
0

#5 Mitglied ist offline   Witi 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.947
  • Beigetreten: 13. Dezember 04
  • Reputation: 43
  • Geschlecht:Männlich
  • Wohnort:Kingsvillage
  • Interessen:Frickeln

geschrieben 07. März 2008 - 07:48

Zitat

hm... also du ahst den fehler nich gefunden?

Ja doch, schau doch was ich fett angestrichen habe.

Wie gesagt, für so etwas brauche ich kein JavaScript...
http://www.cssplay.c...e_vertical.html
[email protected] 0xAAE321A2

50226 - Witis Blog
0

#6 Mitglied ist offline   ps915 

  • Gruppe: aktive Mitglieder
  • Beiträge: 1.119
  • Beigetreten: 17. Mai 07
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 08. März 2008 - 23:16

Oh ja jetzt seh ich den Fehler auch... aber hab ja schon ne Lösung!
Eingefügtes Bild
Deutsches Raspberry Pi Forum
Ein vollwertige Linuxbox mit Ethernet, Hdmi und USB in der Größe einer Kredidkarte für knapp 30 Euro!
0

#7 Mitglied ist offline   ph030 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.132
  • Beigetreten: 14. Juli 04
  • Reputation: 36
  • Geschlecht:unbekannt

geschrieben 09. März 2008 - 06:13

Die aber nicht funktioniert, wenn man (intelligenterweise) JS deaktiviert hat...
/fuck you - really, I mean it!

Zu verkaufen:
Xbox, komplett PC (WF Link)
Hardware, Games, Comics und noch mehr Zeug (eBay-KA Link)
0

Thema verteilen:


Seite 1 von 1

1 Besucher lesen dieses Thema
Mitglieder: 0, Gäste: 1, unsichtbare Mitglieder: 0