Avatar qui coulisse avec feuille perso' derrière en phpBB3

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Sam 24 Mai 2014 - 18:56

EDIT : finalement je n'ai pas besoin que tout le profil soit caché, seulement les champs de la feuille de personnage.


Bonjour !

Vu qu'en phpBB3 nous avons maintenant accès au templates, j'ai voulu ajouter un effet d'avatar qui glisse quand la souris passe dessus pour laisser apparaître les informations de profil.

Bref j'ai suivi les étapes du sujet suivant que j'avais déjà essayé sous phpBB2 : http://forum.forumactif.com/t339094-info-de-profil-cache-derriere-l-avatar

En gros, je dois changer ça :
Code:
       <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
                <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span><br />
                    <span class="postdetails poster-profile">
                    {postrow.displayed.POSTER_RANK}<br />
                    {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}<br /><br />
                    <!-- BEGIN profile_field -->
                    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                    <!-- END profile_field -->
                    {postrow.displayed.POSTER_RPG}
                </span><br />
                <img src="http://illiweb.com/fa/empty.gif" alt="" style="width:150px;height:1px" />
              </td>

En ça :
Code:
       <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
              
                         <span class="rang_mess">{postrow.displayed.RANK_IMAGE}</span>
                        
                         <span class="avatar_mess"><span class="profil_mess"><!-- BEGIN profile_field -->
                    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                    <!-- END profile_field -->
                            {postrow.displayed.POSTER_RPG}</span>
                            {postrow.displayed.POSTER_AVATAR}</span>
                        
                         <span class="pseudo_mess">{postrow.displayed.POSTER_NAME}</span>                
                     
             </td>
Mais j'avais pas pensé que mes templates étaient différentes... Je crois avoir repéré la partie de mon viewtropic-body qui correspond au profil et à l'avatar :
Code:
<div class="postprofile" id="profile{postrow.displayed.U_POST_ID}">
 <!-- div class="online2"></div-->
 <dl>
 <dt>
 {postrow.displayed.POSTER_AVATAR}
 <br /><strong style="font-size:1.2em">{postrow.displayed.POSTER_NAME}</strong>
 </dt>
 <dd>{postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}</dd>
 <dd><br /></dd>
 <dd>
 <!-- BEGIN profile_field -->
 {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
 <!-- END profile_field -->
 {postrow.displayed.POSTER_RPG}
 </dd>
 <dd><br /></dd>
 <dd>
 {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
 </dd>
 </dl>
 </div>

Quelles modifications dois-je faire pour que l'avatar coulisse et laisse apparaître les différents champs du profil derrière ? J'ai peur de faire des bêtises alors je n'ose pas y toucher moi même !


Dernière édition par lunasims57 le Ven 6 Juin 2014 - 21:03, édité 4 fois

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Dim 25 Mai 2014 - 19:01

Je me permets un petit up !

EDIT : s'il n'est vraiment pas possible de faire l'effet que je cherche, est-ce possible de mettre le profil en spoiler dans les messages ?

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Lun 26 Mai 2014 - 19:07

Je remonte !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Mar 27 Mai 2014 - 20:10

Up du jour !
Je suis sûre que la réponse à ma question constituera un grand pas pour l'humanité !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Mer 28 Mai 2014 - 22:04

Upounet !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Jeu 29 Mai 2014 - 22:31

Up !
J'aurais peut-être dû poster ça dans Problème avec un code !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Dim 1 Juin 2014 - 10:19

Je remonte.

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Lun 2 Juin 2014 - 16:06

Nyup !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Mar 3 Juin 2014 - 18:02

Up du jour ♪

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Jeu 5 Juin 2014 - 17:31

Ze remonte !

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par wims le Jeu 5 Juin 2014 - 23:35

Bonjour,

Avant tout, n'oublie pas de faire une sauvegarde de ton template viewtopic_body et de ta CSS s'ils ont été modifiés (si c'est pas le cas, tu peux toujours récupérer le template d'origine).

Donc ce que j'ai fait sur mon forum, j'ai rajouté un div entre ces lignes de mon template view_topicbody (ici on je l'ai appellé scores) :

Code:
<div class=scores><dd>Survolez pour voir les derniers scores</dd>
<dd><img src=http://i58.servimg.com/u/f58/16/61/47/63/rangad10.png></dd>
<!-- BEGIN profile_field -->
<dd>{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT} {postrow.displayed.profile_field.SEPARATOR}</dd>
<!-- END profile_field -->
</div>

Ensuite sur la CSS :

Code:
.scores {
  display:block;
  margin-top:0px;
  height:65px; /* A ajuster */
  overflow:hidden;
  -webkit-transition:all 0.2s;
  -moz-transition:all 0.2s;
  transition:all 0.2s;
}

.scores:hover {
  display:block;
  position:relative;
  height:178px; /* A ajuster */
  -webkit-transition:all 0.2s;
  -moz-transition:all 0.2s;
  transition:all 0.2s;
}

Il faudra que tu ajustes en fonction de ton forum les 2 valeurs height (la première hauteur laissant apparaître les premières lignes que tu veux, par exemple le nombre de messages, etc, la seconde laissant apparaître tout le champ du profil et feuille de perso si ça a été coché).

Tu peux aussi ajuster avec un max-height, mais dans ce cas tu n'auras pas l'effet de transition (le profil complet apparaîtra d'un coup et c'est pas très classe).

J'espère que ça t'aidera !

wims
*

Messages : 37
Inscrit(e) le : 08/01/2014

http://www.lupsclub.com
wims a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatar qui coulisse avec feuille perso' derrière en phpBB3

Message par lunasims57 le Ven 6 Juin 2014 - 19:38

Ooh merci de m'avoir répondu ! Very Happy

Mais c'est bizarre, certaines balises sont devenues rouges regardez :


Sinon le code marche très bien, merci ! J'ai juste dû adapter le CSS pour Firefox que j'utilise, au début j'ai cru que ça marchait pas du coup.

Ça aurait été plus stylé derrière l'avatar mais cet effet me plaît bien en tout cas, merci beaucoup de m'avoir passé tes codes ! :3

EDIT ; je coche résolu, même si j'ai ces trucs rouges ça marche donc c'est pas grave.

lunasims57
**

Féminin
Messages : 85
Inscrit(e) le : 27/11/2011

http://tsuki-no-gakuen.forumactif.org/
lunasims57 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum