Auf Thema antworten 2026

Beitrag

<blockquote data-quote="grv" data-source="post: 1303925" data-attributes="member: 266136">Hi, Zuersteinmal...Ich bin absoluter Noob in Sachen CSS.Mein Prob:Habe &quot;versucht&quot; ein DD-Menue per CSS zu erstellen, und zwar vollkommen aus Grafiken, sprich kein Text. Jeder Link ist also ein Bild. (siehe image)Jedoch wird das HOVER zum Katz und Maus Spiel. Beim Hovern ueber &quot;Einleitung&quot; klappt mir das Dropdown aus, soweit so gut. Wenn man jedoch nun versucht von &quot;Einleitung&quot; z.B. auf den ersten a:hover (untermenue) zu switchen, dann verschwindet das gesamte untermenue...nur manchmal erwischt man ein untermenue, wenn man schnell die maus bewegt...verrueckt...hier die css:&lt;style type=&quot;text/css&quot;&gt;&nbsp;&lt;!--&nbsp;body{&nbsp; &nbsp; position:absolute;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp;#Einleitung{&nbsp; &nbsp; position:absolute;&nbsp; &nbsp; top: 21px;&nbsp; &nbsp; left: 64px;&nbsp; &nbsp; height:50px;&nbsp; &nbsp; width: 142px;&nbsp; &nbsp; margin: 10px;&nbsp; &nbsp; padding: 0px;&nbsp; &nbsp; list-style:none;&nbsp; &nbsp; background-image: url(einleitung.png);&nbsp; &nbsp; background-repeat: no-repeat;&nbsp; &nbsp; text-indent: -999999px;&nbsp; &nbsp; }&nbsp;#Einleitung a{&nbsp; &nbsp; display: none;&nbsp; &nbsp; height: 54px; &nbsp; &nbsp; border: 0px;&nbsp; &nbsp; text-decoration: none;&nbsp; &nbsp; }&nbsp;#Einleitung span{&nbsp; &nbsp;&nbsp; height: 54px;&nbsp; &nbsp;&nbsp; width: 150px;&nbsp; &nbsp;&nbsp; margin: 2px 0px;&nbsp; &nbsp;&nbsp; padding:5px;&nbsp; &nbsp;&nbsp; font-weight: 600;&nbsp; &nbsp;&nbsp; border: none;&nbsp; &nbsp;&nbsp; }&nbsp;#Einleitung:hover{&nbsp; &nbsp;&nbsp; background-position: left -57px;&nbsp; &nbsp;&nbsp; }&nbsp;#Einleitung:hover a {&nbsp; &nbsp;&nbsp; display: block;&nbsp; &nbsp;&nbsp; margin: 2px 0px;&nbsp; &nbsp;&nbsp; padding: 0px 5px;&nbsp; &nbsp;&nbsp; color: #000000;&nbsp; &nbsp;&nbsp; }&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; #chaos a {&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; background-image:url(chaos.png);&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; width: 213px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;&nbsp; #entwicklung a {&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; background-image:url(zahlentw.png);&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; width: 256px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;&nbsp; #imaginaer a {&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; background-image:url(imagzahl.png);&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; width: 256px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;&nbsp; #komplex a {&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; background-image:url(komplzahl.png);&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; width: 256px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp;&nbsp; #darstellung a {&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; background-image:url(darkomplz.png);&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; width: 259px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; #chaos a:hover {&nbsp; &nbsp; &nbsp; &nbsp; background-position: left -50px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; #entwicklung a:hover {&nbsp; &nbsp; &nbsp; &nbsp; background-position: left -50px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; #imaginaer a:hover {&nbsp; &nbsp; &nbsp; &nbsp; background-position: left -50px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; #komplex a:hover {&nbsp; &nbsp; &nbsp; &nbsp; background-position: left -50px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; #darstellung a:hover {&nbsp; &nbsp; &nbsp; &nbsp; background-position: left -50px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; }&nbsp; &nbsp;&nbsp; &nbsp;#Einleitung:hover span{&nbsp; &nbsp;&nbsp; display:block;&nbsp; &nbsp;&nbsp; background-position: left -54px;&nbsp; &nbsp;&nbsp; margin: 0;&nbsp; &nbsp;&nbsp; padding: 0;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; }&lt;/style&gt;Und der Body:&lt;body&gt;&lt;div id=&quot;Einleitung&quot;&gt;&lt;span&gt;Einleitung&lt;/span&gt;&nbsp; &nbsp; &lt;div id=&quot;chaos&quot;&gt;&lt;a href=&quot;chaos.htm&quot;&gt;Chaosforschung&lt;/a&gt;&lt;/div&gt;&nbsp; &nbsp; &lt;div id=&quot;entwicklung&quot;&gt;&lt;a href=&quot;entwicklung.htm&quot;&gt;Entwicklung der Zahlen&lt;/a&gt;&lt;/div&gt;&nbsp; &nbsp; &lt;div id=&quot;imaginaer&quot;&gt;&lt;a href=&quot;imaginaer.htm&quot;&gt;Imaginäre Zahlen&lt;/a&gt;&lt;/div&gt;&nbsp; &nbsp; &lt;div id=&quot;komplex&quot;&gt;&lt;a href=&quot;komplex.htm&quot;&gt;Komplexe Zahlen&lt;/a&gt;&lt;/div&gt;&nbsp; &nbsp; &lt;div id=&quot;darstellung&quot;&gt;&lt;a href=&quot;darstellung.htm&quot;&gt;Darstellung komplexer Zahlen&lt;/a&gt;&lt;/div&gt;&lt;/div&gt;&nbsp;&lt;/body&gt;Waer nett wenn mir jemand helfen koennte. :uhm:</blockquote>

[QUOTE="grv, post: 1303925, member: 266136"] Hi, Zuersteinmal...Ich bin absoluter Noob in Sachen CSS. Mein Prob: Habe "versucht" ein DD-Menue per CSS zu erstellen, und zwar vollkommen aus Grafiken, sprich kein Text. Jeder Link ist also ein Bild. (siehe image) Jedoch wird das HOVER zum Katz und Maus Spiel. Beim Hovern ueber "Einleitung" klappt mir das Dropdown aus, soweit so gut. Wenn man jedoch nun versucht von "Einleitung" z.B. auf den ersten a:hover (untermenue) zu switchen, dann verschwindet das gesamte untermenue...nur manchmal erwischt man ein untermenue, wenn man schnell die maus bewegt...verrueckt... hier die css: <style type="text/css"> <!-- body{ position:absolute; } #Einleitung{ position:absolute; top: 21px; left: 64px; height:50px; width: 142px; margin: 10px; padding: 0px; list-style:none; background-image: url(einleitung.png); background-repeat: no-repeat; text-indent: -999999px; } #Einleitung a{ display: none; height: 54px; border: 0px; text-decoration: none; } #Einleitung span{ height: 54px; width: 150px; margin: 2px 0px; padding:5px; font-weight: 600; border: none; } #Einleitung:hover{ background-position: left -57px; } #Einleitung:hover a { display: block; margin: 2px 0px; padding: 0px 5px; color: #000000; } #chaos a { background-image:url(chaos.png); width: 213px; } #entwicklung a { background-image:url(zahlentw.png); width: 256px; } #imaginaer a { background-image:url(imagzahl.png); width: 256px; } #komplex a { background-image:url(komplzahl.png); width: 256px; } #darstellung a { background-image:url(darkomplz.png); width: 259px; } #chaos a:hover { background-position: left -50px; } #entwicklung a:hover { background-position: left -50px; } #imaginaer a:hover { background-position: left -50px; } #komplex a:hover { background-position: left -50px; } #darstellung a:hover { background-position: left -50px; } #Einleitung:hover span{ display:block; background-position: left -54px; margin: 0; padding: 0; } </style> Und der Body: <body> <div id="Einleitung"> Einleitung <div id="chaos"><a href="chaos.htm">Chaosforschung</a></div> <div id="entwicklung"><a href="entwicklung.htm">Entwicklung der Zahlen</a></div> <div id="imaginaer"><a href="imaginaer.htm">Imaginäre Zahlen</a></div> <div id="komplex"><a href="komplex.htm">Komplexe Zahlen</a></div> <div id="darstellung"><a href="darstellung.htm">Darstellung komplexer Zahlen</a></div></div> </body> Waer nett wenn mir jemand helfen koennte. :uhm: [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?