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.


    Mettre la navigation en colonne (verticalement), positionnement libre

    Partagez
    avatar
    Okhmhaka
    FémininAge : 32Messages : 31851

    le Ven 29 Nov 2013 - 17:39

    Rappel du premier message :



    Navigation en colonne - positionnement libre


    Bien que principalement pour PhpBB2, cette astuce est facilement adaptable pour toutes les versions de forumactif.

    Dans cette astuce l'objectif est de changer l'affichage de la navigation pour qu'elle ne soit plus en ligne mais en colonne, les liens affichés les uns en dessous des autres. La navigation restera cependant celle d'origine et ses liens pourront être modifiés via le panneau d’administration (ajout du calendrier, du portail, etc...). De même, les connectés auront les liens de profil et messagerie que les invités n'auront pas. Bref, vous l'avez compris, la barre barre restera identique dans son contenu que la navigation classique mais son positionnement change, les liens seront les uns en dessous des autres et le bloc qui les contiendra pourra être placé où vous le souhaitez (par défaut dans le code il sera collé au bord gauche de la page.

    Exemple de résultat (le lien "membre" étant survolé) :






    avatar
    Saia
    FémininAge : 22Messages : 186

    le Lun 23 Déc 2013 - 22:45

    Merci!!!!!



    avatar
    pops44
    MasculinAge : 23Messages : 28

    le Mar 24 Déc 2013 - 0:05

    Merci
    avatar
    Kai Turindo
    MasculinAge : 16Messages : 80

    le Mar 24 Déc 2013 - 21:26

    MERCI. Oh mon dieu je cherchais partout. *Q*
    avatar
    servity
    MasculinAge : 45Messages : 82

    le Mer 25 Déc 2013 - 1:44

    Merci pour ce tutoriel.



    avatar
    Arfgang
    MasculinAge : 26Messages : 59

    le Jeu 26 Déc 2013 - 12:53

    Pile ce qu'il me fallait, merci



    avatar
    Afterglow.winter
    FémininAge : 22Messages : 137

    le Jeu 26 Déc 2013 - 18:22

    Merci :)



    How do you get up from an all time low?
    avatar
    shibari
    MasculinAge : 22Messages : 276

    le Sam 28 Déc 2013 - 11:48

    tks





    Merci Dakota pour ce kit.
    avatar
    Henoch
    FémininAge : 35Messages : 34

    le Sam 28 Déc 2013 - 15:21

    ça à l'air sympa merci!
    avatar
    Lilly31
    FémininAge : 26Messages : 97

    le Dim 29 Déc 2013 - 12:05

    Merci :)



    avatar
    Pastomaniac
    FémininAge : 21Messages : 194

    le Lun 30 Déc 2013 - 0:14

    Thanks.



    avatar
    Venise
    FémininAge : 34Messages : 270

    le Jeu 2 Jan 2014 - 14:22

    merci capitaine
    avatar
    -Jukai.
    MasculinAge : 25Messages : 18

    le Dim 5 Jan 2014 - 12:37

    Merci du partage Wink
    avatar
    N3MO
    MasculinAge : 26Messages : 36

    le Mer 8 Jan 2014 - 17:49

    merci pour le partage je continue mon fouinage Very Happy

    Par contre il y a un petit bug ici:
    Code:
    #navig a /* personnalise les liens */
    {
      display: block; /* met les liens en colonne */
      margin-bottom: -20px; /* enleve l'espacement par defaut des liens entre eux */
      background: #ffffff; /* couleur de fond des liens */
      border-bottom: 1px solid #e6e6e6; /* bordure basse des liens */
      padding: 3px 10px; /* marge interieure des liens */
      text-align: center; /* alignement du texte */
      text-transform: uppercase; /* met le texte en majuscule */
      transition: 1s; /* realise une transition lente avec l effet au survol */
      -moz-transition: 1s;
      -htm-transition: 1s;
      -o-transition: 1s;
      -webkit-transition: 1s;
    }

    Il faut enlever à la ligne margin-bottom l'apostrophe" l'espacement"
    avatar
    Neymar
    MasculinAge : 19Messages : 138

    le Mer 8 Jan 2014 - 19:46

    Merci du Partage généreuse personne ~
    avatar
    Toshiki
    FémininAge : 21Messages : 54

    le Jeu 9 Jan 2014 - 17:33

    merci
    avatar
    Zuny
    FémininAge : 23Messages : 18

    le Ven 10 Jan 2014 - 14:37

    Merci Razz
    avatar
    JasLo
    FémininAge : 15Messages : 76

    le Sam 11 Jan 2014 - 16:24

    Je cherchais un code comme celui-là!
    avatar
    Souky Mitsu
    FémininAge : 27Messages : 102

    le Sam 11 Jan 2014 - 18:37

    Parfait ! C'est-ce que je cherchais héhé. Merci :)
    avatar
    Shalyma
    FémininAge : 27Messages : 486

    le Sam 11 Jan 2014 - 20:26

    Merci pour ce truc ^^




    Merci Marie Chérie pour le kit!
    avatar
    Amera
    FémininAge : 25Messages : 67

    le Mar 14 Jan 2014 - 18:55

    Merci beaucoup !



    avatar
    Hayden Joy
    FémininAge : 23Messages : 24

    le Mer 15 Jan 2014 - 18:59

    Merci !
    avatar
    Chou.
    FémininAge : 21Messages : 22

    le Mer 15 Jan 2014 - 20:20

    Merci , merci <3



    avatar
    Ninchat
    FémininAge : 24Messages : 6

    le Jeu 16 Jan 2014 - 18:03

    J'aime beaucoup ! Merci
    avatar
    Zeyro
    FémininAge : 24Messages : 3

    le Sam 18 Jan 2014 - 0:45

    Testons cela ! Merciii
    avatar
    Faraday
    FémininAge : 27Messages : 39

    le Jeu 23 Jan 2014 - 11:18

    Merci!
    Contenu sponsorisé


      La date/heure actuelle est Jeu 21 Sep 2017 - 15:59