Flashforum - Die Community zu Adobe Flash, Flex AIR. Web Design und Inspiration.

kingkong1 · 06-07-2009, 10:45

hi

ich versuche gerade für eine bildergalerie einen ähnlichen effekt zu erzielen wie er bei der bildersuche von bing.com verwendet wird (Beispiel). ich meine das menü das beim mouseover von bildern aufgeht.

ein menü das zb. unterhalb des bildes aufgeht würde ich noch hinbekommen. wie macht man das aber am besten das es "um" das bild herum aufgeht. der quellcode der seite ist leider so unübersichtlich das ich daraus einfach nicht schlau werde.
kennt jemand evtl. ein tutorial das in die richtung geht oder vergleichbare beispiele bei denen ich mir den quellcode ansehen kann?

danke

Nicmare · 06-07-2009, 15:10

ist jetzt die frage wie bewandert du in JS und CSS bist.
ich würde die listenelemente erstmal mit position:relative versehen. und dann mit JS nen hover effect fürn div basteln der dann wieder mit position:absolute formatiert ist. diesen div kannst du dann mit top:-10px und left:-10 und breite x mittig positionieren und beliebig gestalten! in diesem div ist das bild dann auch noch mal eingefügt damit der effekt entsteht, dass ein rahmen ums bild erscheint. nur so als denkansatz.

kingkong1 · 07-07-2009, 11:52

das problem ist aber, dass das DIV anfangs ausgeblendet sein muss (display:none;). und da sich das bild ja innerhalb des DIVs befindet, wäre es auch nicht zu sehen - oder habe ich jetzt einen denkfehler?

Nicmare · 07-07-2009, 11:55

ja hast du. das bild ist ja doppelt vorhanden. Es wird einfach ein Layer über das eigentlich Bild gelegt. In diesem ist eben das selbe Bild nochmal. wenn ich zeit finde, kann ich mal an nem beispielscript probieren. aber nur wenn du es wirklich nicht hinbekommst

06-07-2009, 10:45	#1 (permalink)
kingkong1 Neuer User Registriert seit: Oct 2006 Beiträge: 57	Mouseover wie bei bing.com Bildersuche hi ich versuche gerade für eine bildergalerie einen ähnlichen effekt zu erzielen wie er bei der bildersuche von bing.com verwendet wird (Beispiel). ich meine das menü das beim mouseover von bildern aufgeht. ein menü das zb. unterhalb des bildes aufgeht würde ich noch hinbekommen. wie macht man das aber am besten das es "um" das bild herum aufgeht. der quellcode der seite ist leider so unübersichtlich das ich daraus einfach nicht schlau werde. kennt jemand evtl. ein tutorial das in die richtung geht oder vergleichbare beispiele bei denen ich mir den quellcode ansehen kann? danke

06-07-2009, 15:10	#2 (permalink)
Nicmare Wetmaster Registriert seit: Aug 2001 Ort: BERLIN Beiträge: 3.075	ist jetzt die frage wie bewandert du in JS und CSS bist. ich würde die listenelemente erstmal mit position:relative versehen. und dann mit JS nen hover effect fürn div basteln der dann wieder mit position:absolute formatiert ist. diesen div kannst du dann mit top:-10px und left:-10 und breite x mittig positionieren und beliebig gestalten! in diesem div ist das bild dann auch noch mal eingefügt damit der effekt entsteht, dass ein rahmen ums bild erscheint. nur so als denkansatz. Geändert von Nicmare (06-07-2009 um 15:11 Uhr)

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

07-07-2009, 11:52	#3 (permalink)
kingkong1 Neuer User Registriert seit: Oct 2006 Beiträge: 57	das problem ist aber, dass das DIV anfangs ausgeblendet sein muss (display:none;). und da sich das bild ja innerhalb des DIVs befindet, wäre es auch nicht zu sehen - oder habe ich jetzt einen denkfehler?

07-07-2009, 11:55	#4 (permalink)
Nicmare Wetmaster Registriert seit: Aug 2001 Ort: BERLIN Beiträge: 3.075	ja hast du. das bild ist ja doppelt vorhanden. Es wird einfach ein Layer über das eigentlich Bild gelegt. In diesem ist eben das selbe Bild nochmal. wenn ich zeit finde, kann ich mal an nem beispielscript probieren. aber nur wenn du es wirklich nicht hinbekommst