avatar
Sexe : Masculin
Date d'inscription : 30/11/2017
Messages : 21
Newbie
Voir le profil de l'utilisateur
# Tout petit problème!le Dim 3 Déc 2017 - 9:14

Quelle structure est concernée par votre problème ? Barre de navigation
Qu'elle est l'adresse du forum concerné (sous hide si cela vous dérange) ? http://test-ouat.forumactif.com

Expliquez précisément votre problème : Donc pour explication rapide, je suis professeur des écoles et j'ai pour projet de monter un fofo-rpg avec mes élèves où chacun pourra prendre un petit personnage et interagir avec les autres! Je n'ai pas besoin de beaucoup d'aide en codage car j'arrive bien à me débrouiller avec un peu de LS et du bidouillage ! Mais la semaine dernière, bam ! problème! Comme je n'avais jamais rencontré de problème en code et que j'ai toujours envie de m'améliorer, je me suis inscris ici ! J'espère que vous pourrez m'aider !

Je vous présente mon problème, mais pour ça il faut d'abord que vous vous connectiez au fofo car s'est dans l'interface utilisateur du joueur que tout se déroule !

http://test-ouat.forumactif.com/

Login : Testeur
Mdp : test2578

(Rassurez vous, pour la barre de nav, je ne vous l'ai pas piqué, je l'ai trouvé en LS ^^)

Une fois connecté, j'aimerai deux choses que je n'arrive pas à mettre en place :

Que la couleur du pseudo dans le message de Bienvenue soit de la couleur du groupe.
Que le cercle autour de l'avatar prennent également la couleur du groupe principal!
(je sais pas si je suis clair...)
En gros si le joueur fait parti du Groupe des Bleus, je veux que son pseudo et le cercle autour de l'avatar réduit dans la barre de nav soit de la couleur des bleus)

Pour informations, j'ai fait ca à partir d'un libre service, j'ai modifié la feuille de style CSS et la Template du Haut du forum bien evidemment !

Merci d'avance ^^
si c'est impossible (même si je sais que l'impossible n'existe pas en codage xD) n'hésitez pas à me le dire !
Voilà mon code : (sous phpbb2)
Les codes :
Code:
  <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}" id="navSIT">
    <tr><td><!-- BEGIN switch_user_logged_in --><div class="avaSIT"></div><div class="welcSIT"></div><!-- END switch_user_logged_in --></td></tr>
    <script type="text/javascript">$(function(){$('.avaSIT').html(_userdata.avatar);{$('.welcSIT').html( _userdata.username);}});</script>
    <tr><td class="navSIT" align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td></tr>
    </table>


Code:
/* NAVIGATION */
    #navSIT {
    position:fixed; z-index:5; left:0; top:0;
    width:100%; height:25px; border-width:2px; border-color:darkred; border-style:groove;
    background-image:url(http://img15.hostingpics.net/pics/12894114kgumtjpg.png); /* MODIFIABLE */
    }
    .navSIT {
    position:absolute; top:15px; right:15px;
    }
    .mainmenu img {
    display:none;
    }
    /* BORDURE AVATAR */
    .avaSIT {
    position:absolute; z-index:5; left:15px;
    width:75px; height:75px; border-radius:75px; overflow:hidden; border:3px solid;
    border-color:darkred; /* MODIFIABLE */
    }
    /* IMAGE AVATAR */
    .avaSIT img{
    width:75px;
    }
    /* MESSAGE DE BIENVENUE */
    .welcSIT {
    position:absolute; left:130px; top:20px;
    font-size:12px; font-family:Arial; font-weight:bold; margin-top: -15px
        /* MODIFIABLE */
    color:darkred;/* MODIFIABLE */
    }

    /* BIENVENUE */
    .welcSIT::before {
    float:left; margin-right:5px;
  content:'Bienvenue,'; /* MODIFIABLE */
    }
    /* LIENS NAVIGATION */
    #navSIT a{
    display:inline-block; vertical-align:middle;
    text-align:center;
    text-transform:uppercase; font-size:12px; font-family:Georgia; margin-top: -30px;/* MODIFIABLE */
    color:darkred; /* MODIFIABLE */
    transition:all .65s linear; -webkit-transition:all .65s linear;
    }
    /* SURVOL LIEN NAVIGATION */
    #navSIT a:hover {
    color:#4D5756; /* MODIFIABLE */
    }
    /* DECONNEXION */
    a#logout.mainmenu {
    font-size:0px;
    }
    a#logout.mainmenu::after {
    display:inline-block; vertical-align:middle;
    font-size:12px !important; content:'Déconnexion'; /* MODIFIABLE */
    }
    /* MENU RECHERCHE */
    #search_menu {
    top:45px !important; left:5% !important;
    }
    /* COULEUR FOND MENU RECHERCHE */
    #search_menu td.row2 {
    background:lightgrey !important; font-family:Arial; /* MODIFIABLE */
    }
    /* COULEUR TEXTE MENU RECHERCHE */
    #search_menu td.row2 span.genmed {
    color:black !important; /* MODIFIABLE */
    }
    /* TITRE MENU RECHERCHE */
    #search_menu th.thHead {
    text-transform:uppercase; font-family:Arial; /* MODIFIABLE */
    background:black; color:white; /* MODIFIABLE */
    }
    /* BARRE MENU RECHERCHE */
    #search_menu input.post {
    height:23px !important; border:none !important;
    background:white; color:black; /* MODIFIABLE */
    }
    /* BOUTON MENU RECHERCHE */
    #search_menu input.button {
    height:25px; border:none !important; text-transform:uppercase;
    background:black; color:white !important; /* MODIFIABLE */
    }
    /* RECHERCHE AVANCEE */
    #search_menu a{
    display:block; margin-bottom:5px; width:235px;
    background:none !important; border:none !important;
    text-transform:uppercase; font-weight:bold; color:black !important; /* MODIFIABLE */
    }


avatar
Sexe : Féminin
Date d'inscription : 15/12/2012
Messages : 3990

Fiche Membre
Lots gagnés:
Admin' / Designer
Voir le profil de l'utilisateurhttp://sarahdealerevans.deviantart.com/gallery/
# Re: Tout petit problème!le Dim 3 Déc 2017 - 17:14
Coucou :)

Comme vu sur la CB, ton problème de barre de navigation vient de ça

Code:
#fa_toolbar {
    background-color: transparent!important;
    box-sizing: border-box;
    padding: 5px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

Il faut modifier ceci : z-index: 999; pour cela z-index: 1;

Pour le reste je ferai des test et je reviendrais vers toi plus tard :)
avatar
Sexe : Masculin
Date d'inscription : 30/11/2017
Messages : 21
Newbie
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Dim 3 Déc 2017 - 17:16
Ca marche ! Merci beaucoup en tout cas pour ta réactivité !!!
avatar
Sexe : Féminin
Date d'inscription : 05/06/2014
Messages : 2869

Fiche Membre
Lots gagnés:
Maxi-codeuse en stage - Mère-Grand ❤ - Ex-admin
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Lun 4 Déc 2017 - 17:59
J'archive du coup !






Mes cadeau ♥️:

Merci Milou ♥️

Merci Amorthancia pour le cadeau de Noël  cadeau

Merci Aed ♥️

Merci Aed ♥️

Merci Loune ♥️

Merci Milou pour le vava ♥️

Merci Aed ♥️

Merci Ashounet ♥️
avatar
Sexe : Masculin
Date d'inscription : 30/11/2017
Messages : 21
Newbie
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Lun 4 Déc 2017 - 18:10
Euh nooon, mon premier problème de JavaScript est pas résolu ^^ Sur comment on met mes pseudos en couleurs de groupe dans barre de nav, et idem pour la couleur de l'avatar xD
avatar
Sexe : Féminin
Date d'inscription : 05/06/2014
Messages : 2869

Fiche Membre
Lots gagnés:
Maxi-codeuse en stage - Mère-Grand ❤ - Ex-admin
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Lun 4 Déc 2017 - 18:29
Oups je vais le rechanger xD






Mes cadeau ♥️:

Merci Milou ♥️

Merci Amorthancia pour le cadeau de Noël  cadeau

Merci Aed ♥️

Merci Aed ♥️

Merci Loune ♥️

Merci Milou pour le vava ♥️

Merci Aed ♥️

Merci Ashounet ♥️
avatar
Sexe : Masculin
Date d'inscription : 30/11/2017
Messages : 21
Newbie
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Lun 4 Déc 2017 - 18:45
Merciiiiiiiiiiiiiiiii :D
avatar
Sexe : Masculin
Date d'inscription : 30/11/2017
Messages : 21
Newbie
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Ven 8 Déc 2017 - 9:14
Petit réup avec éclaircissement du problème :

- Connectez vous toujours sous le compte Tester : Login : Testeur ; Mdp : test2578

- J'aimerai que : la bordure de l'avatar réduit circulaire soit de la couleur du groupe (Par exemple, Testeur doit être vert) + La couleur du nom du compte soit aussi de la couleur du groupe.

- Après étude du problème, je pense que c'est du JavaScript, dans le sens où je dois créer deux script, l'un qui renvoie à la couleur de la bordure, l'autre à la couleur du pseudo ! Grace à épicode, j'ai énormément progressé en HTML et en CSS, mais alors là pour moi le JS c'est du chinois ! Donc j'aimerai bien un peu d'aide ^^
avatar
Sexe : Féminin
Date d'inscription : 05/06/2014
Messages : 2869

Fiche Membre
Lots gagnés:
Maxi-codeuse en stage - Mère-Grand ❤ - Ex-admin
Voir le profil de l'utilisateur
# Re: Tout petit problème!le Ven 8 Déc 2017 - 14:33
C'est en effet du JS qu'il faut pour faire ce que tu souhaite. Je n'est pas eu le temps de regarder si j'était capable de faire... Le JS est un langage plus difficile et je ne le métrite pas beaucoup (bien que je me débrouille). Il faut savoir qu'il y a présentement peu de membre actif sur le forum qui savent bien le manipuler.

Bref quand j'aurais du temps je vais regarder mais je ne promet rien ;)






Mes cadeau ♥️:

Merci Milou ♥️

Merci Amorthancia pour le cadeau de Noël  cadeau

Merci Aed ♥️

Merci Aed ♥️

Merci Loune ♥️

Merci Milou pour le vava ♥️

Merci Aed ♥️

Merci Ashounet ♥️
Contenu sponsorisé
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum