Deux mini questions

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Deux mini questions

Message par Missindo le Jeu 12 Avr 2012 - 17:51

Ami du jour bonjour, ou ami du soir bonsoir, tout dépend de l'heure ou l'on lira mon message. J'ai découvert sur le site en fouinant un peux partout, le tuto du tableau en accordéon et j'aimerais beaucoup savoir si l'on peu retirer les chiffres que j'ai mis dans le cadre rouge suivant ça et aussi si à la place de la couleur grise déprimante comment mettre tout en blanc, mais en gardant les cadres comme il sont et la couleur de texte en noir ?!

Merci d'avance pour toute vos réponse


Dernière édition par Missindo le Dim 15 Avr 2012 - 17:08, édité 1 fois

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Matriochka le Jeu 12 Avr 2012 - 18:03

Bonsoir,

Serait-il possible d'avoir les codes que vous avez inséré pour obtenir cet accordéon ? HTML / CSS Smile

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Jeu 12 Avr 2012 - 18:16

Bien sur que oui ^^

Html :

Code:
  <div id="accordeon-pa" class="accordion">
            <ol>
                <li>
                    <h2><span>♥ Contexte ♥</span></h2>
                    <div>
                      <figure>
                        En cours
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>♦ Liens utiles ♦</span></h2>
                    <div>
                      <figure>
                        A Venir
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>♣ Staff ♣</span></h2>
                    <div>
                      <figure>
                        ....
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>☼ Crédit ☼</span></h2>
                    <div>
                      <figure>
                        /*-/*-/*-
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>♫ Nos Amis ♫</span></h2>
                    <div>
                      <figure>
                        .................
                      </figure>
                    </div>
                </li>
            </ol>
        </div>

CCS :

Code:
  @charset 'utf-8';
        /*************************************************!
        *
        *  project:    liteAccordion - a horizontal accordion plugin for jQuery
        *  author:    Nicola Hibbert
        *  url:        http://nicolahibbert.com/liteaccordion-v2/
        *  demo:      http://www.nicolahibbert.com/demo/liteAccordion/
        *
        *  Version:    2.0.2
        *  Copyright:  (c) 2010-2011 Nicola Hibbert
        *  Licence:    MIT
        *
        **************************************************/
        /****************************************** Core */
        .accordion { text-align: left; font: 'Helvetica Neue', Verdana, Arial, sans-serif }
        .accordion > ol { position: relative; overflow: hidden; height: 100%; margin: 0; padding: 0; list-style-type: none }
        .accordion .slide > h2 {
          color: black;
            font-size: 16px;
          font-weight: normal;
          margin: 0;
          z-index: 100;
          position: absolute;
          top: 0;
          left: 0;
          -webkit-transform: translateX(-100%) rotate(-90deg);
          -webkit-transform-origin: right top;
          -moz-transform: translateX(-100%) rotate(-90deg);
          -moz-transform-origin: right top;
          -o-transform: translateX(-100%) rotate(-90deg);
          -o-transform-origin: right top;
          transform: translateX(-100%) rotate(-90deg);
          transform-origin: right top;
          -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
            filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
        }
        .accordion .slide > h2 span {
            display: block;
            padding-right: 8%;
            text-align: right;
            height: 90%;
            margin-top: 5px;
            -moz-user-select: none;
            -khtml-user-select: none;
            user-select: none;
        }
        .accordion .slide > h2 b {
            display: inline-block;
            position: absolute;
            top: 13%;
            left: 10%;
            text-align: center;
            -webkit-transform: rotate(90deg);
            -moz-transform: rotate(90deg);
            -o-transform: rotate(90deg);
            transform: rotate(90deg);
          -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
            filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
        }
        .accordion .slide > h2:hover { cursor: pointer }
        .accordion .slide > div { height: 100%; position: absolute; top: 0; z-index: 10; overflow: hidden; background: white }
        .accordion noscript p { padding: 10px; margin: 0; background: white }
       
        /***************************************** Light */
        .accordion {
            border: 9px solid white;
            border-bottom-width: 8px;
            padding: 5px 5px 6px 0;
            background: #a0a0a0;
            -webkit-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
            -moz-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
            -ms-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
            -o-box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
          box-shadow: -1px -1px 0 #c0c0c0, 1px 1px 0 #c0c0c0, 0 5px 15px rgba(0, 0, 0, 0.4);
        }
        .accordion .slide > h2 { background: #a0a0a0; text-shadow: 0 -1px 0 white; line-height: 265% }
        .accordion .slide > h2 span {
            background: #fcfcfc;
            background: -moz-linear-gradient(left,  #fcfcfc 0%, #ededed 100%);
            background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fcfcfc), color-stop(100%,#ededed));
            background: -webkit-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
            background: -o-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
            background: -ms-linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
            background: linear-gradient(left,  #fcfcfc 0%,#ededed 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed',GradientType=1 );
            -webkit-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
            -moz-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
            -o-box-shadow: -1px -1px 0 #909090 inset, 1px 1px 0 #909090 inset;
          box-shadow: -1px -1px 0 #FFFFFF inset, 1px 1px 0 #FFFFFF inset;
            color: #000000;
        }
        .accordion .slide > h2 b { background: #ffffff; color: #909090; text-shadow: -1px 1px 0 white }
        .accordion .slide > h2.selected span, .accordion .slide h2.selected span:hover, .accordion .slide > h2.selected b { background: #ffffff }
        .accordion .slide > div { background: #a0a0a0; margin-left: 5px }
       
        /*************************************** Rounded */
        .rounded, .rounded > ol { -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px }
        .rounded .slide > h2 span { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px }
       
        /******************************************** IE */
        .ie .slide > h2 b { top: 42%; left: 5% }
        .ie9 .slide > h2 { filter: none; -ms-transform: translateX(-100%) rotate(-90deg); -ms-transform-origin: right top }
        .ie.accordion .slide > h2 b { top: 44% }
        .accordion .slide > h2 span { filter: none }
       
        /******************************************** FA */
        .accordion figure .full { width: 100%; height: 100%; }
        .accordion h2 { border: none; }
       
        /* centrer l'accordéon */
        .accordion { margin: auto; }

Et voilà!!

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Matriochka le Jeu 12 Avr 2012 - 18:23

Merci Smile

Alors, concernant les chiffres en bas, ils proviennent du code jQuery, mais je ne vais pas être en mesure de vous aider davantage… Ce langage et moi ne sommes pas encore complètement amis… Il va falloir attendre la réponse d'une personne plus compétente.

En revanche, pour ce qui est de la personnalisation, il va falloir modifier ça dans les CSS. Et pour ce faire sans se prendre la tête, ça va être très simple, il vous suffit de recherchez à chaque fois cette couleur : #A0A0A0, qui correspond au gris clair, pour la modifier par celle de votre choix Wink Modifiez-la sur chacun des éléments que vous désirez colorer.

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Jeu 12 Avr 2012 - 18:31

Merci beaucoup pour ce petit début d'aide ^^ j'adore ton vava

Edit: En fait si je change juste ça, ben ça deviens tout moche

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Ven 13 Avr 2012 - 9:40

désolé du double poste

Couleur c'est bon j'ai ce que je voulais, mais pour retirer les chiffres ont fait comment ?

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Matriochka le Ven 13 Avr 2012 - 13:31

Merci pour l’avatar Smile

Par contre, pour les chiffres, comme je l’ai précisé plus haut, je n’ai pas les compétences requises pour vous aider. Je vais donc signaler votre message à des personnes plus qualifiées afin qu’elles puisse vous venir en aide.

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Ven 13 Avr 2012 - 13:33

Merci beaucoup c'est très gentil de ta part ^_^

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Ven 13 Avr 2012 - 16:06

Bonjour,

Attention, les balises <figure> n'existent qu'en HTML5, et ton forum est en xhtml.

Ensuite, sans aller jusqu'à modifier le jQuery, tu peux simplement masquer le chiffre en CSS :
Code:
.accordion .slide h2 > b { visibility: hidden }

Sinon, les options du Slider prévoient le fait que tu ne veuilles pas de ces nombres, il suffit de le préciser lors de l'appel de la fonction. Il y a en effet un endroit dans ton forum (poste un lien, je serais en mesure de voir où) où tu dois avoir quelque chose du style :

Code:
<script>
   $('#yourdiv').liteAccordion();
</script>

Qu'il te suffit de modifier comme suit :
Code:
<script>
$('#yourdiv').liteAccordion({
   enumerateSlides : false
});
</script>

Ce, en gardant bien sûr d'éventuelles modifications déjà effectuées.

À noter qu'il faudrait au passage rendre les balises script valide xhtml en précisant le type, donc :
Code:
<script type="text/javascript">
$('#yourdiv').liteAccordion({
   enumerateSlides : false
});
</script>

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Ven 13 Avr 2012 - 18:13

euh... franchement? je patauge à fond xd je suis une boulette


Dernière édition par Missindo le Ven 13 Avr 2012 - 18:17, édité 1 fois

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Ven 13 Avr 2012 - 18:15

Dis-nous si tu y arrives. Wink

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Ven 13 Avr 2012 - 18:18

Je me rend, je ferais mieux de faire ça à tête reposé

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Dim 15 Avr 2012 - 11:27

j'abandonne j'arrive à rien du tout, je laisse tel que c'est

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Dim 15 Avr 2012 - 15:58

Pourquoi tu n'ajoutes pas simplement ça dans ton css ?
Code:
.accordion .slide h2 > b { visibility: hidden }

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Dim 15 Avr 2012 - 16:03

euh pas bête xd

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Dim 15 Avr 2012 - 16:17

Alors ?

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Dim 15 Avr 2012 - 16:50

juste comme ça ou à la place d'autre chose?

edit: rahh je laisse tomber, j'ai tout foiré


Dernière édition par Missindo le Dim 15 Avr 2012 - 16:53, édité 1 fois

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Dim 15 Avr 2012 - 16:51

Juste comme ça oui

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Dim 15 Avr 2012 - 17:04

ouiiiiiiiiiiiiiiiiiii merci du fond du coeur

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Manumanu le Dim 15 Avr 2012 - 17:08

Je t'en prie. Pense à mettre le sujet en résolu. Wink

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Deux mini questions

Message par Missindo le Dim 15 Avr 2012 - 17:08

c'est fait

Missindo
****

Féminin
Messages : 398
Inscrit(e) le : 20/07/2011

http://coeur-et-force.forumactif.org/
Missindo a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum