Effetto Hover-Slide con JS [era: con CSS3]

[LAZebra]

Buonasera a tutti! Ho un quesito da porvi. Navigando tra i vostri script ho trovato questo in java http://javascript.html.it/demo/javas...emo_index.html

Vorrei ottenere qualcosa di simile usando esclusivamente i css su due immagini che si scambiano. Ho letto qualcosa sul CSS3 e mi sembra possibile. Tuttavia non riesco ad avvicinarmi a quell'effetto. Qualcuno può aiutarmi?

[Mich_]

Quello mi sembra sia Javascript, non Java.

Comunque non e` posibile una cosa di quel tipo con solo CSS: Le pseudoclassi :visited, :hover, ecc definiscono alcune situazioni statiche, mentre in quello script viene cambiata una immagine ad ogni passaggio del mouse, e le immagini sono almeno tre per ogni riquadro (quelle che ho contato io, ma potrebbero essere di piu`).

E gli effetti di transizione di quel tipo si possono realizzare in CSS, ma solo per alcuni browser, per cui non sono praticamente realizzabili a livello generale.

[LAZebra]

Si scusa, nella fretta non ho scritto "script" dopo. Quindi mi consigli comunque di utilizzare javascript?

Nel caso in cui volessi restituire il valore iniziale al mouseOut come dovrei procedere?

mi spiego meglio: vorrei che, quando il mouse non sta sull'immagine, tornai tutto allo stato iniziale, ovvero sulla prima immagine

[Mich_]

Allora non ho capito cosa vuoi.

In quel sito ogni volta che passi (evento mouseover) sopra un'immagine questa cambia, poi al mouseout non cambia. Viene fatto un ciclo su tre immagini diverse per ogni area. Questa e` una cosa che non si riesce a fare tramite CSS.

Invece se vuoi che cambi qualcosa all':hover e che poi venga ripristinato quando finisce l':hover, il CSS e` sufficiente. Pero` gli effetti di transizione in CSS funzionano solo in alcuni browser (non i piu` diffusi).

[LAZebra]

ho visto scrivendo il codice in CSS3, che su firefox non viene visualizzato correttamente, quindi resto su javascript.

L'effetto di transizione tra le immagini mi interessa,quindi vorrei che al mouseOut venga ripristinata la prima delle tre immagini (quella iniziale), in che modo è possibile modificare il codice javascript per restituire quest'effetto?.

[Mich_]

Sposto in Javascript.

Comunque ritengo che la domanda non sia ancora sufficientemente chiara: ti consiglio di fare uno schema del tipo:
- al primo mouseover voglio che ...
- al secondo mouseover ...
- al mouseout ...
- dopo tot secondi ...

[LAZebra]

ho modificato il codice scambiando solo 2 immagini, quindi vorrei che;

mouse out: img1
mouse over:img2
mouse out: img 1

voglio mantenere l'effetto di transizione javascript,quindi andrebbe fatto dentro lo stesso codice javascript