Galerie-Licht-Effekt?

[biertrinker]

Hallo

Ich habe eine Galerie mit einer lightbox erstellt ,was auch recht gut läuft
jetzt möchte ich aber noch eine art hover effekt einbauen das heißt " wenn jemand über die kleinen bilder in der galerie mit der maus zieht soll das bild ein wenig aufleuchten

[ezzemm]

Das ist eine schöne Idee. Dann mach das doch...

[TheGamer]

Das ist eine schöne Idee. Dann mach das doch...

;D mehr faellt mir dazu auch nicht ein.

@biertrinker

Wolltest du uns dass nur mitteilen oder brauchst du Hilfe?

[biertrinker]

eigentlich wollte ich nach hilfe fragen deswegen frage ich ja an

ein beispiel habe ich hier

http://www.tishacreative.com/what-we-do/

[darph]

eigentlich wollte ich nach hilfe fragen deswegen frage ich ja an
Fragezeichen helfen. Manchmal. Ganz ehrlich. Um dir helfen zu können, wäre es zum Beispiel hilfreich, zu wissen, wobei du Hilfe brauchst.

[biertrinker]

es geht um diesen licht effekt beim hovern woher ich diesen bekomme und wie ich ihn am besten einfüge

[PhoenixFG]

Eine Möglichkeit wäre, ein zusätzliches Hover-Bild zu erstellen, auf welches Du den gewünschten Effekt anwendest. Bei Mouseover wird dann einfach das normale Bild durch das Hover-Bild ersetzt.

MfG

[mictasm]

Mir kam beim Ansehen der Beispiel-Homepage eine Idee, die ist eigentlich zu gut, um sie zu veröffentlichen.

Wie wäre es mit einer Transparenz in den Vorschaubildern und einem wechselnden Zellenhintergrund (hinter dem Bild). Beim dunklen Hintergrund sieht man das Bild kräftig und beim Hover gibts den hellen Hintergrund für diesen Aufhellungseffekt.


Bei denen wird es im css scheinbar so gemacht:

#portfolio-box {
width: 160px;
float: left;
padding: 3px;
margin-bottom: 6px;
margin-right: 6px;
}

.portfolio-thumb {
opacity: 1;
filter: alpha(opacity=100);
}

.portfolio-thumb:hover {
opacity: .6;
filter: alpha(opacity=60);
}

Ich wusste gar nicht, dass das auch im Firefox funktioniert.

[Ripsta]

Genau, ist wie mictasm schon sagte reicht einfach:

css:
a.thumb img { filter:alpha(opacity=100); -moz-opacity: 0.50; opacity: 0.50; }
a.thumb:hover img { filter:alpha(opacity=50); -moz-opacity: 1.0; opacity: 1.0; }

html:
<a href="" class="thumb"><img src="" /></a>

[DanMan]

Genau, ist wie mictasm schon sagte reicht einfach:

css:
a.thumb img { filter:alpha(opacity=100); -moz-opacity: 0.50; opacity: 0.50; }
a.thumb:hover img { filter:alpha(opacity=50); -moz-opacity: 1.0; opacity: 1.0; }

html:
<a href="" class="thumb"><img src="" /></a>

Warum behandelst du den IE anders als die anderen?

[Ripsta]

Sehr gute frage ;)
Habs ehrlich gesagt damals auch nur so aufgegriffen und weitergeführt :P

[Nedo]

Mach's :) Habs auf meiner Seite (siehe Sig.) auch. Macht schon irgendwie was her.

[thacrazze]

http://javafx.com/samples/DisplayShelf/index.html