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/QUEEL en accordéon vertical sur clic ! [HTML/CSS/JAVASCRIPT]

    Partagez
    FémininAge : 27Message(s) : 307

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Glycérine
    le Mer 8 Fév 2012 - 13:16
    Rappel du premier message :

    Encore un ? Pourquoi ?

    Bonjour, bonjour !

    Aujourd'hui et pour ma première astuce, j'adapte un code de Sparrow-style (avec sa permission Wink) qui est l'un de ses célèbres accordéons ! Mais avec du JavaScript cette fois !
    En effet, vous avez été quelques uns à vous demander s'il était possible "d'avoir le même mais avec clic et pas survol". Donc, on l'a fait. Et comme je suis pas douée pour les longs discours, voyez par vous même !

    >> Aperçu <<

    Comme pour celui de Sparrow, il vous sera possible de changer les couleurs et/ou images de fond pour chaque onglet ou encore de modifier le fond du contenu, les images, la taille (l'astuce pour la taille est à la fin, au départ le contenu a 250px de hauteur), tout ça quoi ^^.

    Let's go !


    Et comment qu'on fait ?

    Je préviens, la manipulation est un tout petit peu plus complexe que la version "survol" et il faut que vous ayez le JavaScript activé sur votre forum. Mais je vais vous expliquer tout ça en détail, don't worry Willy.

    1. Le HTML
    Pour voir ce code, vous devrez poster à la suite de ce topic !



    2. Le CSS
    Pour voir ce code, vous devrez poster à la suite de ce topic !




    3. Le JavaScript
    Pour voir ce code, vous devrez poster à la suite de ce topic !




    Je vais citer Sparrow pour ce qui est des crédits de Never-Utopia Wink

    Je le répète, mais svp n'enlevez pas le crédit en fin de code ! Je suis très généreux mais j'apprécie d'avoir un remerciement et j'estime que celui-ci est correct, pas excessivement voyant et normal pour utiliser quelque chose que j'ai mis du temps à réaliser Wink




    Pour avoir un onglet ouvert dès le départ




    Dernière édition par Glycérine le Dim 15 Juil 2012 - 11:38, édité 3 fois



    FémininAge : 23Message(s) : 73
    りん
    le Mer 29 Fév 2012 - 10:25
    Merci pour l'astuce ~
    FémininAge : 22Message(s) : 43

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Haaken
    le Ven 2 Mar 2012 - 6:04
    Merci beaucoup pour le tuto ! Very Happy
    FémininAge : 28Message(s) : 101
    TUC
    le Lun 5 Mar 2012 - 18:56
    merci (:


    MasculinAge : 40Message(s) : 4
    Theblacktemplar
    le Mer 7 Mar 2012 - 16:23
    Cela serait pour une intégration d'un accordéon vertical 8 menu dans une widget. Après je ne sais pas exactement ce qu'il faut faire , c'est pourquoi je cherche de l'aide

    merci d'avance
    MasculinAge : 21Message(s) : 14
    Dr. Karlos
    le Mer 7 Mar 2012 - 17:08
    Wow!
    MasculinAge : 21Message(s) : 2286

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Taktiik
    le Mer 7 Mar 2012 - 17:30
    Glycérine, tu es ma déesse *_* !

    Merci beaucoup !
    Taktiik.
    Message(s) : 15
    jean44
    le Mer 7 Mar 2012 - 18:35
    merci
    MasculinAge : 32Message(s) : 72
    Solstice
    le Jeu 8 Mar 2012 - 8:26
    J'suis très curieux :lol:
    MasculinAge : 32Message(s) : 111

    Les Guildes
    Guilde des Conteurs:
    0/0  (0/0)
    Guilde des Illusionnistes:
    0/0  (0/0)
    Guilde des Architectes:
    0/0  (0/0)
    Dastan
    le Jeu 8 Mar 2012 - 14:13
    Je trouve ca super! merci!
    FémininAge : 20Message(s) : 56
    Vampi
    le Ven 23 Mar 2012 - 8:09
    Merci (:



    Merci Yakkuru =D

    Spoiler:

    Merci Jiyuu =D
    MasculinAge : 23Message(s) : 48
    Laxuslightning
    le Sam 24 Mar 2012 - 11:01
    Merci beaucoup !
    FémininAge : 19Message(s) : 17
    Riingo
    le Mer 28 Mar 2012 - 17:30
    Merci !
    MasculinAge : 20Message(s) : 183
    Mario
    le Ven 30 Mar 2012 - 19:48
    Merci n_n


    MasculinAge : 37Message(s) : 100
    Parka
    le Ven 30 Mar 2012 - 20:04
    Voir
    FémininAge : 21Message(s) : 550
    Ayael
    le Mer 4 Avr 2012 - 16:45
    Merci je cherchais justement un script de menu déroulant^^!
    MasculinAge : 20Message(s) : 61
    Midnigth
    le Mer 4 Avr 2012 - 22:51
    merci ^^
    MasculinAge : 21Message(s) : 32
    blaster
    le Jeu 5 Avr 2012 - 17:53
    Merci




    Je serais Abs du 06/08 jusqu'au 26/08 , je vous prie de ne pas supprimez mes topics !!
    MasculinAge : 23Message(s) : 7
    Tamaki
    le Jeu 5 Avr 2012 - 20:57
    Joli et pratique. Merci !
    MasculinAge : 22Message(s) : 203
    Kawel
    le Sam 7 Avr 2012 - 14:55
    I want see *o*
    Merci pour le partage Wink


    Invité
    le Dim 8 Avr 2012 - 14:34
    Merci beaucoup (:
    FémininAge : 19Message(s) : 115
    cosmos-chann
    le Dim 8 Avr 2012 - 15:01
    Merci
    FémininAge : 19Message(s) : 36
    Sably
    le Jeu 19 Avr 2012 - 18:39
    Merci =)


    FémininAge : 25Message(s) : 1143

    Les Guildes
    Guilde des Conteurs:
    3/10  (3/10)
    Guilde des Illusionnistes:
    0/10  (0/10)
    Guilde des Architectes:
    0/10  (0/10)
    Rozenbrez
    le Jeu 19 Avr 2012 - 19:11
    Merci pour ce tuto ^^


    FémininAge : 23Message(s) : 6
    chienchila
    le Ven 20 Avr 2012 - 22:46
    Merci !
    FémininAge : 26Message(s) : 32
    Bang!
    le Sam 19 Mai 2012 - 0:55
    Merci pour le tuto !


    ham7
    Contenu sponsorisé
    Aujourd'hui à 15:52

      La date/heure actuelle est Lun 26 Sep 2016 - 15:52