Fade sur image

[lhooq]

Bonjour,

J'ai un petit problème.
Je veux appliquer un fade sur des images.
Le code est :

<style type="text/css" media="screen">
    
    /* BEGIN CSS */
    .fadeThis {
        position:relative;
        display:block;
        height: 337px;
        width: 280px;
        background:url(../../img/texner/pub_textile.jpg) 0 0 no-repeat;
    }
    .hover {
        position: absolute;
        top: 0px;
        left: 0;
        display: none;
        height: 337px;
        width: 280px;
        background:url(../../img/texner/pub_textileNB.jpg) 0 0px  no-repeat;
    }
    /* END CSS */
</style>


<script type="text/javascript">
$(document).ready(function() {
    // find the div.fade elements and hook the hover event
    $('.fadeThis').hover(function() {
        // on hovering over find the element we want to fade *up*
        var fade = $('> .hover', this);

        // if the element is currently being animated (to fadeOut)...
        if (fade.is(':animated')) {
            // ...stop the current animation, and fade it to 1 from  current position
            fade.stop().fadeTo(500, 1);
        } else {
            fade.fadeIn(500);
        }
    }, function () {
        var fade = $('> .hover', this);
        if (fade.is(':animated')) {
            fade.stop().fadeTo(500, 0);
        } else {
            fade.fadeOut(500);
        }
    });

    // get rid of the text
    $('.fadeThis > .hover').empty();
});
</script>

Le problème est que j'ai 3 images, comment faire pour déclarer les 2 autes images ?

J'ai le code suivant pour l'appele de la fonction

<a class="fadeThis" href="../textile/index.php"  title="Textile"><span class="hover"><img  src="../../img/texner/pub_textile.jpg" alt="Textile"  /></span></a>

Merci d'avance pour vos réponses!

Eric

 

[momo-fr]

L'exemple en ligne me parlerais plus, dans ton code on voit bien la description CSS d'une seule image, il faudrait donc faire de même pour les autres.

Quel est l'effet souhaité ?

Si c'est une "descente" de quadri je passerais plutôt par un effet d'opacité, si tu veux un joli dégradé regarde chez jQuery tu devrais trouver ton bonheur, je pense par exemple à l'effet sur les vignettes de cette galerie en exemple.

 

[lhooq]

Je souhaite changer les images quand je survole les images.
Mais je ne vois pas comment déclarer mes style fadeThis et hover pour les autres images
Quelqu'un a-t-il un début de solution ?