Bonjour,

En allant sur ce lien : http://www.ray.fr/noemie/ vous remarquerez un petit beug en passant rapidement la souris sur les trois icônes en bas à droite dans le footer : Les "span" restent affichés alors que la souris n'est plus sur le lien. Je vous colle le code du fichier PHP et JS pour que vous puissiez m'aider à régler ce problème.

Fichier PHP :

<div id="footer">
        <div id="contenu_footer">
            <div class="copyright">(contenu copyright)</div>
            <div class="adresse">(contenu adresse)</div>
            <div class="icones">
                    <a class="devis" href="#"><span>Demander un devis</span><img src="images/devis.png" alt="Demander un devis"/></a>
                    <a class="contact" href="#"><span>Contact</span><img src="images/contact.png" alt="Contact"/></a>
                    <a class="perso" href="#"><span>Qui suis-je ?</span><img src="images/perso.png" alt="Qui suis-je ?"/></a>
                </div>
        </div>
</div>

Fichier JS :

var jQuery_sans_conflit = jQuery.noConflict(); //permet d’éviter le conflit entre mootools, utilisé par joomla, et jquery que j'utilise 
jQuery_sans_conflit(function()
{

    jQuery_sans_conflit("#footer #contenu_footer .icones a img").hover( function(){
                jQuery_sans_conflit(this).animate({
                    bottom:0}, 300).dequeue(); //en passant la souris sur l'image, celle-ci remonte à bottom 0 (elle est au départ à -15px)
                jQuery_sans_conflit(this).parent().find("span").animate({
                    opacity: 1}, 300).dequeue(); //en passant la souris sur l'image, le texte contenu dans le span s'affiche (l'opacité est au départ à 0 et passe à 1)     
    },function(){
                jQuery_sans_conflit(this).animate({
                    bottom:-15}, 300).dequeue(); //lorsque la souris n'est plus sur l'image, celle-ci redescend à sa position initiale qui est -15px
                jQuery_sans_conflit(this).parent().find("span").animate({
                    opacity: 0}, 100).dequeue(); //lorsque la souris n'est plus sur l'image, le texte contenu dans le span ne s'affiche plus (opacité à 0)      
    });
});

4 réponses


Essaie ça var jQuery_sans_conflit = jQuery.noConflict;

n0wmi
Auteur

Tu veux dire, sans la parenthèse ? Ça ne marche pas du tout du coup...

Tu veux faire quoi à la première ligne ?
Peux tu commenter ton code ?

n0wmi
Auteur

La première ligne permet d’éviter le conflit entre mootools, utilisé par joomla, et jquery que j'utilise.
J'ai commenté mon code. Comme tu peux le voir sur le site, les images montent et descendent correctement au survol et au désurvol des images, les span s'affichent correctement au survol de la souris, mais ne reprennent pas correctement leur opacité à 0 au désurvol