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

Milouze14 le 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  




Voila, c'est tout pour le moment .
Un soucis direction l'entraide
https://www.milouze14.com/f14-entraide-forumactif

Teten85 le Dim 8 Mar 2015 - 11:38

patriciadpt30 le Ven 27 Mar 2015 - 12:47

Invité le Sam 28 Mar 2015 - 8:18

mariok le Mer 10 Juin 2015 - 23:11

dymo le Mer 29 Juil 2015 - 1:42

Invité le Mer 5 Aoû 2015 - 19:28

Gae le Mer 16 Sep 2015 - 15:52

Invité le Sam 3 Oct 2015 - 1:05

Ezio le Sam 31 Oct 2015 - 13:26

lmc38510 le Dim 29 Nov 2015 - 11:13

Ancients le Lun 7 Mar 2016 - 8:23

Invité le Mar 8 Mar 2016 - 13:56

dragon594 le Lun 11 Avr 2016 - 1:45

Invité le Sam 30 Juil 2016 - 17:03

Psychotic Bitch le Jeu 1 Sep 2016 - 10:59

SuperSpaceCab le Lun 10 Oct 2016 - 6:55

msfeettoes le Ven 14 Avr 2017 - 9:37

50Thierry le Jeu 4 Mai 2017 - 4:44

OptimaluS le Jeu 4 Mai 2017 - 23:37

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

chrisnvidia le Sam 24 Mar 2018 - 20:15

hamesashek le Dim 6 Jan 2019 - 11:18

Ptite_Perle le Dim 10 Fév 2019 - 11:57

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

Invité le Mer 27 Fév 2019 - 17:20