GFX-Sector - HTML, CSS

Box-Hover Effekt

Hallo liebe Community
Ich will einen Hover Effekt an dieser Box erstellen:
http://guesswhat.square7.ch/problem.html (direkter dl: http://www.multiupload.com/TSJS6GTJL0 )

Dieser soll folgendermasen aussehen (eigentlich ist es ein verkehrter(?!) Hover effekt ) :
Wenn man nicht mit der Maus über der Box ist, sollte eine weiße Schicht mit sagen wir mal einer Transperenz von 10% über der gesamten Box sein!
Wenn man dann mit der Maus darüberfährt soll diese weiße Schicht verschwinden, also auf 0% Transperenz gehen.
Weil das noch nicht genug is, sollte das auch noch in einem sanftem Übergang passieren, sprich nicht plötzlich!

So siehts aus ..
ich hab leider keinen plan wonach ich googeln müsste, damit ich was zu dem thema finde .....

Ich hoffe ihr wisst was ich meine

Danke schonmal im voraus, ich google solange weiter nach unbekannt
flx

Gut - ich hab das jetzt geschafft!
Mithilfe dieses Codes:

code: 1: 2: 3: 4: 5: 6: 7: $(".container1").css ({ opacity: 0.7 }).hover(function() { $(this).animate({ opacity: 1 }); }, function() { $(this).animate({ opacity: 0.7 }); }); </script>

allerdings steh ich jetzt vorm nächsten "problem"

ich möchte, dass dieser code auch den div-classes ".container2" & 3 zugewiesen wird!
aber ohne, dass ich das gesamte script dupliziere

geht das? wenn ja - wie?

This post has been edited 2 time(s), it was last edited by .flx: 11.09.2011 20:36.

Danke!!!
Hab jetzt nach deinen anstössen noch ein bisschen gegooglet und hab das gefunden !
das is zwar nicht exakt das was ich suche, aber der für mich essentielle teil war dabei ))

1:

  -webkit-transition: opacity .5s ease-in-out;  -moz-transition: opacity .5s ease-in-out;  -o-transition: opacity .5s ease-in-out;  transition: opacity .5s ease-in-out;

If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)