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

Milouze14 Dim 8 Mar 2015 - 7:50

,

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  

Teten85 Dim 8 Mar 2015 - 11:38

patriciadpt30 Ven 27 Mar 2015 - 12:47

Invité Sam 28 Mar 2015 - 8:18

mariok Mer 10 Juin 2015 - 23:11

dymo Mer 29 Juil 2015 - 1:42

Invité Mer 5 Aoû 2015 - 19:28

Gae Mer 16 Sep 2015 - 15:52

Invité Sam 3 Oct 2015 - 1:05

Ezio Sam 31 Oct 2015 - 13:26

lmc38510 Dim 29 Nov 2015 - 11:13

Ancients Lun 7 Mar 2016 - 8:23

Invité Mar 8 Mar 2016 - 13:56

dragon594 Lun 11 Avr 2016 - 1:45

Invité Sam 30 Juil 2016 - 17:03

Psychotic Bitch Jeu 1 Sep 2016 - 10:59

SuperSpaceCab Lun 10 Oct 2016 - 6:55

msfeettoes Ven 14 Avr 2017 - 9:37

50Thierry Jeu 4 Mai 2017 - 4:44

OptimaluS Jeu 4 Mai 2017 - 23:37

dédé54 Sam 24 Mar 2018 - 18:20

chrisnvidia Sam 24 Mar 2018 - 20:15

hamesashek Dim 6 Jan 2019 - 11:18

Ptite_Perle Dim 10 Fév 2019 - 11:57

Invité Mer 27 Fév 2019 - 17:19