AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Profil en hover avec perspective

    Partagez
    Alumine
    FémininAge : 19Messages : 488

    le Dim 20 Sep - 16:01

    Rappel du premier message :

    Profil en hover avec perspective





    Hello all ! Bon bah voilà, encore un profil, avec une petite transition cool et les infos à l'intérieur sur des petites bandes... bref.

       
    PHPBB2 - Template et CSS - taille de l'avatar adaptable - Aperçu - Aperçu à l'ouverture



    Et un autre aperçu, pour la transition...





    Template


    Ok, dans le panneau d'admin > affichage > templates > général > viewtopic-body, cherchez ceci (vers la ligne 139)
    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}" style="position: relative; top: -30px; width: 1px;" id="{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>

    Supprimez, et remplacez par ça :


    Là, sur la première ligne vous trouverez ça:
    Code:
    min-height:320px;
    Vous pouvez adapter cette hauteur en fonction de la hauteur des avatars de votre forum; il s'agit de la hauteur minimum d'un message (si le message est plus petit que l'avatar, les avatars des différents messages vont se chevaucher, ce qui serait fâcheux...)



    CSS

    Ensuite validez, publiez le template, puis rendez vous dans affichage > couleurs > feuille de style CSS, et ajoutez ceci à votre code:



    A priori vous ne devriez pas avoir besoin de modifier autre chose que les lignes commentées... Enregistrez, et tout devrait fonctionner !


    Code mis sous hide - Merci de laisser un crédit à N-U quelque part sur votre forum !


    Dernière édition par Alumine le Lun 21 Sep - 21:18, édité 1 fois



    Alumine
    Sophie2
    FémininAge : 53Messages : 39

    le Mer 22 Juin - 16:58

    Merci.
    Electro
    FémininAge : 20Messages : 30

    le Ven 1 Juil - 13:23

    merciiii
    andie_xcv
    FémininAge : 21Messages : 34

    le Sam 2 Juil - 21:41

    Ce code a l'air super ! Merci :)
    Inoue Musaki
    FémininAge : 27Messages : 147

    le Dim 3 Juil - 18:42

    merci
    Lynnakiel
    FémininAge : 20Messages : 18

    le Dim 3 Juil - 19:51

    Merci ! Je vais tester ça Wink
    Nekrofyre
    MasculinAge : 17Messages : 33

    le Lun 4 Juil - 2:23

    joli
    Dearborn
    FémininAge : 22Messages : 99

    le Dim 10 Juil - 11:02

    Merci!
    Eryu
    FémininAge : 24Messages : 37

    le Lun 18 Juil - 19:09

    L'effet est vraiment intéressant je trouve ^^ Du coup ça me donne envie d'essayer 'w'
    Merci donc pour ce code !
    Ombinou
    FémininAge : 22Messages : 104

    le Sam 23 Juil - 1:02

    Merci beaucoup. C'est très original
    EOS
    MasculinAge : 23Messages : 34

    le Dim 24 Juil - 13:55

    Merci
    Ryukaï
    MasculinAge : 18Messages : 528

    le Mar 26 Juil - 16:42

    merci Very Happy



    Merwyn Arehdel
    FémininAge : 17Messages : 298

    le Jeu 28 Juil - 15:31

    Wow merci ! :)



    Just want to be yours.
    Mistiny
    FémininAge : 13Messages : 23

    le Ven 29 Juil - 17:54

    J'adore ! Merci beaucoup pour le partage ! ^^
    ShiShi_Chan
    MasculinAge : 27Messages : 51

    le Lun 1 Aoû - 1:53

    Super astuce ! Merci bien *_*
    nikuchips
    FémininAge : 15Messages : 3

    le Sam 6 Aoû - 21:21

    Merci :3
    NekoMiaouw
    FémininAge : 20Messages : 115

    le Mar 23 Aoû - 15:43

    J'aime beaucoup ce système, merci!



    Liumi
    MasculinAge : 16Messages : 9

    le Lun 29 Aoû - 22:12

    merci :)
    Nyroc
    MasculinAge : 14Messages : 51

    le Ven 9 Sep - 21:37

    Merci ^^



    witm
    FémininAge : 23Messages : 50

    le Jeu 15 Sep - 19:38

    merci beaucoup :heart:
    Yunroxas
    FémininAge : 23Messages : 35

    le Sam 24 Sep - 20:17

    Merci, le principe est génial
    noksye
    FémininAge : 25Messages : 51

    le Mar 27 Sep - 0:24

    Merci !
    Noubil
    FémininAge : 28Messages : 56

    le Jeu 13 Oct - 23:55

    J'adore :love:
    Star Rock Shooter
    MasculinAge : 20Messages : 11

    le Ven 14 Oct - 17:52

    Merci beaucoup ! :bisou:
    leviarthrite
    FémininAge : 29Messages : 26

    le Ven 14 Oct - 19:05

    Merci
    Alborio
    MasculinAge : 17Messages : 12

    le Jeu 27 Oct - 14:00

    Merci!
    Contenu sponsorisé


      La date/heure actuelle est Lun 27 Fév - 9:51