[TOUTES VERSIONS] Afficher l'avatar des messages au survol de la cellule

,

si vous avez activé l'affichage des avatars dans les messages:
Affichage/Page d'acceuil/ Structure et hiérarchie/Hiérarchie

Afficher les avatars dans la colonne "Derniers messages" : Cocher Oui

Dans ce cas de figure les avatars sont visibles .

Voilà une petite astuce qui va mettre une opacité à 0 sur l'avatar et au survol de la cellule ce dernier s'affichera progressivement   .
Quelque soit votre structure l'astuce fonctionnera les ami(e)s.



Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.

Déposez ce script:

Code:

$(function(){
$('.lastpost-avatar').closest('td , dd').attr('id','M14_Last_Ava');
});

Pensez a cliquer sur le bouton 


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style


Si cette class existe dans votre feuille de style :

Code:

.lastpost-avatar

Ajoutez ceci:

Code:

-moz-opacity:0;
-khtml-opacity:0;
-ms-filter:"alpha(opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
filter:alpha(opacity=0);
opacity:0;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;

Puis ajoutez :

Code:

#M14_Last_Ava:hover .lastpost-avatar
{
-moz-opacity:1;
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;

}

---

Pour ceux ou la class n’existe pas ajoutez ce contenu:

Code:

.lastpost-avatar
{
-moz-opacity:0;
-khtml-opacity:0;
-ms-filter:"alpha(opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
filter:alpha(opacity=0);
opacity:0;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

#M14_Last_Ava:hover .lastpost-avatar
{
-moz-opacity:1;
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;

}

Penses à valider les modifications en cliquant sur le bouton  

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup pour cette astuce !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !