Bienvenue
sur
Never-Utopia

Tu es déconnecté.

Never-Utopia

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.


    PA onglets latéraux contenu apparaissant "onClic" (focus - CSS)

    Partagez
    MasculinAge : 31Message(s) : 31651

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    5/10  (5/10)
    Guilde des Architectes:
    3/10  (3/10)
    Okhmhaka
    le Sam 24 Nov 2012 - 17:54
    Rappel du premier message :

    Salut salut x)

    Voici donc une nouvelle PA à remplir ensuite par vos soins, sous forme d'onglets latéraux mais dont le contenu s'affiche en cliquant avec l'emploi du "focus" en pseudo-class CSS (pour ceux à qui ça parle^^).
    Un petit aperçu tout d'abord :

    Lien Forum Test

    Il s'agit de la troisième PA, celle ayant une image manga et en titre "Welcome + What's up ?".

    Information importante : j'ai voulu ici utiliser le "focus" en alternative au "target" pour créer un effet au clic, et non au survol. Que ça vous parle ou non peu importe, sachez juste qu'il y a un "défaut" avec l'utilisation du focus, c'est que lorsqu'on clique aille ça l'enlève. Du coup, lorsque vous êtes sur le contenu de l'un des onglets et que vous cliquez sur la page, que ce soit à l'intérieur ou à l'extérieur, vous revenez sur le contenu par défaut. Je vous rassure cependant si vous comptez mettre des liens dans vos contenus, même si le fait de cliquer ramène au contenu par défaut le lien fonctionnera quand même.
    Sachez le cependant avant de l'utiliser.


    Pour voir le contenu du tutoriel merci de poster un message à la suite !




    En cas d'utilisation de ces codes merci de mettre un crédit à Never-Utopia sur votre forum, même si vous personnalisez le code, la base a été écrite ici. Un petit crédit, ce n'est pas grand chose, et nous ne demandons que ça pour le partage de notre petit savoir x)


    Dernière édition par Sparrow-style le Jeu 28 Mar 2013 - 12:50, édité 1 fois


    FémininAge : 102Message(s) : 71
    Ellen Lesley
    le Ven 17 Avr 2015 - 13:41
    Magnifique *^*
    MasculinAge : 20Message(s) : 14
    Kuroshiro
    le Mer 22 Avr 2015 - 10:05
    Simple mais abouti, c'est parfait, merci !
    MasculinAge : 18Message(s) : 22
    CraWox
    le Mar 12 Mai 2015 - 17:37
    Merci énormement
    MasculinAge : 18Message(s) : 22
    CraWox
    le Mar 12 Mai 2015 - 17:58
    Pourrais-je avoir un peu d'aide pour installer la page d'accueil je n'y arrive pas .. Ou copier le code HTML svp ?
    MasculinAge : 21Message(s) : 189
    Løve
    le Sam 23 Mai 2015 - 14:06
    merci :3
    FémininAge : 25Message(s) : 148
    Misery Mind™
    le Sam 23 Mai 2015 - 17:25
    merci !
    MasculinAge : 21Message(s) : 35
    Shinichi
    le Sam 23 Mai 2015 - 18:51
    Thank's. Et bravo, c'est très réussi.
    FémininAge : 20Message(s) : 667

    Les Guildes
    Guilde des Conteurs:
    2/10  (2/10)
    Guilde des Illusionnistes:
    2/10  (2/10)
    Guilde des Architectes:
    6/10  (6/10)
    Shaneliae
    le Mar 26 Mai 2015 - 15:51
    Hmm... Je suis intéressée parce que je cherche un bon système pour faire des onglets et c'est pile celui qu'il me faut, mais j'aurais peut-être préféré avec un système de target du coup 'o'


    FémininAge : 20Message(s) : 53
    Meranii
    le Mar 26 Mai 2015 - 22:21
      Merci beaucoup du partage !


    MasculinAge : 15Message(s) : 44

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Liam212
    le Jeu 2 Juil 2015 - 16:56
    J'adore *.*


    FémininAge : 36Message(s) : 5
    Lady C
    le Mar 4 Aoû 2015 - 19:21
    C'est le style que je cherchais ! Merci !


    FémininAge : 24Message(s) : 1354

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Kelalin
    le Mar 4 Aoû 2015 - 19:27
    Merci du partage ! (^~^)
    FémininAge : 22Message(s) : 52
    lisounette7
    le Mar 4 Aoû 2015 - 21:09
    Yeah, trop cool <3
    Merci beaucoup <3
    MasculinAge : 21Message(s) : 55
    Merino
    le Mer 12 Aoû 2015 - 13:28
    Merci d'avance Very Happy
    MasculinAge : 25Message(s) : 10
    Wawi
    le Dim 23 Aoû 2015 - 4:59
    Merci!:p
    FémininAge : 20Message(s) : 211
    Djeina
    le Jeu 3 Sep 2015 - 4:03
    Merci :)
    FémininAge : 25Message(s) : 56
    lukygirl
    le Mar 8 Sep 2015 - 20:41
    merciii du partage


    FémininAge : 22Message(s) : 13
    Michi-Sushi
    le Mer 23 Sep 2015 - 16:50
    Merci pour ce code vraiment magnifique ! Beau travail :)
    FémininAge : 19Message(s) : 144
    Whit
    le Jeu 24 Sep 2015 - 19:46
    Merci beaucoup ! =3
    FémininAge : 18Message(s) : 80
    Heah92
    le Dim 22 Nov 2015 - 19:24
    Merci.
    MasculinAge : 24Message(s) : 177
    darkhero246
    le Ven 27 Nov 2015 - 10:21
    Merci pour le tuto Very Happy
    MasculinAge : 24Message(s) : 42
    wally the bully
    le Ven 27 Nov 2015 - 18:08
    merci
    MasculinAge : 11Message(s) : 11
    BlackAndBlue
    le Sam 28 Nov 2015 - 12:58
    Merci
    FémininAge : 20Message(s) : 53
    Myrcella Heaven
    le Dim 29 Nov 2015 - 14:31
    Merci !
    FémininAge : 31Message(s) : 228
    Madras
    le Jeu 7 Jan 2016 - 22:55
    Merci
    Contenu sponsorisé
    Aujourd'hui à 15:39

      La date/heure actuelle est Mer 28 Sep 2016 - 15:39