Hallo Leute,

ich habe zwar ein kleines bisschen schon mit CSS zu tun, aber das hab ich noch nie gemacht und alles was ich dazu finden konnte war entweder mit JavaScript oder mit top, bottom, left und right grafiken die angebunden gelöst und jetzt stellt sich für mich die Frage, geht das evtl gar nicht ?

So viel zur Vorgeschichte und jetzt im Klartext:

ich möchte ein Dopdown Menü machen für meine seite und zwar soll eine kleine Kugel unten in der mitte auf der seite sein und wenn man mit der maus drauf geht, soll nach oben eine große halbtransparente Kugel erscheinen und da drinnen drei vier links (untereinander aufgelistet).

Alles was ich bisher in bezug auf Dropdown Navi / Menü ect. gefunden habe ist entweder ganz ohne Hintergrundgrafik oder wie schon oben erwähnt entweder mit js oder mit diesen seitenrändern.

Gibt es keine Möglichkeit das ganze mit einer einzigen Grafik als Hintergrundbild und dann einfach die Links?


Ich wäre echt froh und dankbar wenn ihr mir da einen Tipp geben könntet

Das geht.








Nimm Dir mal den Code eines simplen CSS-Dropdownmenüs (google) vor, die "Mechanik" ist da ganz gut sichtbar. Du hast ein "verstecktes" Element das erst sichtbar ist/wird, wenn jemand mit der Maus über das Elternelement drüber geht oder durchtabbt. (Es gibt noch andere Möglichkeiten... aber das soll erstmal reichen)

In diesem Element, z.b. einem Div, ist dein "größeres" Hintergrundbild drin und in das div kommt die Liste nach deinen Wünschen. Wenn das Ding nach oben gehen soll, ist es dann eigentlich ein Dropup-Menü. Damit musst Du den sichtbar werdenden Teil "nach oben" schieben, das geht mit negativen Werten für die "top" Positionierung.

__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte

Danke für die Antwort das es möglich sei - das ermutigt mich weiter zu machen und zu tüfteln, aber das was google betrifft, ich habe schon gesucht ohne ende (stundenlang) und wie ich schon erwähnt habe, waren das alles entweder komplett ohne Grafik (also nur Text-Links), mit der border(left,right,top,bottom) Technik oder mit JS.

- Textbasiert kann ich nicht nutzen, weil es zu der fast schon komplett fertiggestalteten Seite nicht passt - würde nicht harmonieren

- Border-Technik kann ich nicht nutzen, da es um so vieles auffwändiger wäre, da die Grafik Transparenz- und Verlaufsflächen hat

- JavaScript will ich nicht nutzen, da ich nicht so arrogant sein will zu sagen, dass alle die js aktiviert haben bzw. die Möglichkeit dazu haben (man denke nur an Firmen wo standardmäßig js aus is), können oder dürfen die Seite vollständig betrachten / besuchen und alle anderen sollen hin wo der Pfeffer wächst - das wäre weder sozial noch sinnig


Ich hab schon einen einigermaßen annähernd in die Richtung funktionierenden code getüfftelt, aber ich kriegs nicht hin, dass die Links die erst mit diesem Art Hover-Effekt eingeblendeten Fläche erst erscheinen. Entweder sind sie IMMER da oder samt der Hover-Effekt-Fläche NICHT da - ich verzweifle langsam.

Ok, dann brauchts CODE und zwar lauffähigen.

Idealerweise ein Testcase mit DEINEM Stand. Darauf kann man aufbauen.
So aus dem hohlen Bauch heraus wird es sonst schwierig.
(Freehoster gibt es genug für eine einzelne Testseite)

__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte

Nun ja, wie soll ich es sagen?

Ich hab sehr viel herumgetüftelt und erst gestern die Sache gelöst - es funzt - aber hab ich daraus was lernen können? NEIN, da die Lösung nicht das geringste mit Logik zu tun hat - ich musste mit unnötigen floats, margins, paddings, z-index und und und arbeiten (also die ganze Palette was CSS bietet für ein Dopdown hergenommen).

Naja, es bleibt mir nur das so zu akzeptieren - wer weiss, vielleicht wird diese Angelegenheit ja mit HTML5 und den folgenden CSS Versionen besser (vorallem logisch nachvollziehbarer und evtl. endlich mit Farbverläufen und ja mit runden ecken )


Somit ist mein Anliegen geklärt und Thread kann geclosed werden

Würde mich trotzdem interessieren, deine Lösung
CSS ist nicht einfach obwohl ich mal das Gegenteil behauptet habe...
aber das überlasse ich Dir

__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte

Kein Problem, ich kann dir ja das drumherum weglassen und den rest samt css in eine html reinsetzen und dann den code hier reinsetzen - aber das mache ich morgen, heute kann ich kein code mehr sehen - sonst schmeiss ich mein monitor vom balkon runter!

Ich bin so froh wenn ich endlich bald meine SolidStateDisc und 8GB RAM - dann ist das auch erträglicher.

Ich poste es morgen dann mal rein ok