Un code pour la PA accordéon

4 participants

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

Résolu Un code pour la PA accordéon

Message par Jézebel L. Jeu 14 Fév 2013 - 13:26

Bonjour à Tous Very Happy

J'installe actuellement la nouvelle PA accordéon qu'à proposer d'ailleurs forumactif.
Mais voilà, sur l'image de fond, j'aimerais mettre un texte, qui se trouverait lui même dans un petit cadre aux bords arrondis et fond gris ou blanc ou noir transparent (afin de voir l'image de fond), et avec une barre de défilement, si le texte est grand.
Malheureusement je connais pas ce code pour le mettre dans le CSS ou la page d’accueil généralité.
Aidez moi svp, juste une petit code....

Merci d'avance.


Dernière édition par Jézebel L. le Dim 3 Mar 2013 - 19:07, édité 1 fois
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Jeu 14 Fév 2013 - 16:02

Pardon ! et je voulais savoir, quel code rectifier, pour rétrécir la pa accordéon
merci.

https://forum.forumactif.com/t327581-message-d-accueil-en-accordeon?highlight=panneau+accord%E9on
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Ven 15 Fév 2013 - 16:41

SVP
up !
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Lun 18 Fév 2013 - 15:45

SVP !!!

Up ! u_u
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Mar 19 Fév 2013 - 20:24

Personne ? OO

Up !
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Patapon Mar 19 Fév 2013 - 20:48

Salut,

Tu as essayé de modifier les codes de ton Javascript au début ? Remplace 800 et 320 :

Code:
$(document).ready(function() {
          $("#accordeon-pa").each(function(){
            $(this).liteAccordion({
              autoPlay:true,
              pauseOnHover:true,
              rounded:true,
              enumerateSlides:true,
              containerWidth: 800,
              containerHeight: 320
Patapon

Patapon
**

Masculin
Messages : 55
Inscrit(e) le : 01/09/2011

http://www.another-adventure.com
Patapon a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Jeu 21 Fév 2013 - 15:41

Salut !

cela aurait pour effet de bien centrer l'image, ok
mais y'a t'il un code pour ensuite créer un autre cadre, tenez voici un exemple de ce que je veux :

Un code pour la PA accordéon Sans_t10

Donc un code pour remplir avec la 1ère image
mais je viens de l'avoir, car il faut modifier juste le Java.
Et un autre code pour créer des cadres (gris ou peu importe la couleur)
avec un overflow.
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Lun 25 Fév 2013 - 14:45

Up ! svp -_-
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Mar 26 Fév 2013 - 20:27

Up !!!
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Mer 27 Fév 2013 - 22:21

UP !!
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Jeu 28 Fév 2013 - 16:51

SVP UP !
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Sam 2 Mar 2013 - 18:50

svp ? Quelqu'un ?

Up ! Sad
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Un code pour la PA accordéon

Message par Aryaline Dim 3 Mar 2013 - 16:48

Bonjour,
Tu fais un tableau à deux colonnes :

Code:
<table><tr><td>
<div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;""><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></td><td><div style="margin-left:25px">
<div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;"><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></div></tr></td></table>

Après tu changes la taille et la couleur.
Bonne journée.
Aryaline

Aryaline
*

Féminin
Messages : 42
Inscrit(e) le : 15/01/2008

http://noblebourg.forumactif.org/
Aryaline a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par NovemberGrW Dim 3 Mar 2013 - 17:07

Aryaline a écrit:Bonjour,
Tu fais un tableau à deux colonnes :

Code:
<table><tr><td>
<div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;""><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></td><td><div style="margin-left:25px">
<div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;"><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></div></tr></td></table>

Après tu changes la taille et la couleur.
Bonne journée.

Je suis d'accord avec ceci, j'ai essayée : beau résultat Very Happy
NovemberGrW

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Dim 3 Mar 2013 - 18:26

Kikou !

Merci d'avoir répondu !!!

Mais je le met où le code ? stp ^^'
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Aryaline Dim 3 Mar 2013 - 18:30

Coucou.
Et bien, tu le mets là dans l'emplacement où tu dois mettre ton texte. Je suppose que les petits cadres sont le contenu dans ton menu déroulant. Tu le place dans la partie TEXTE de tes News. Lorsque tu remplis cette partie là pour mettre ton texte. Tu mets simplement le code.
Bonne journée.
Aryaline

Aryaline
*

Féminin
Messages : 42
Inscrit(e) le : 15/01/2008

http://noblebourg.forumactif.org/
Aryaline a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Dim 3 Mar 2013 - 18:35

Donc je mets dans : Page d'Accueil > Général > Message sur la page d'accueil ?
Par contre j'ai Texte, voilà comment c'est le code :
je mets entre Figure ?



Code:
        <div id="accordeon-pa" class="accordion">
            <ol>
                <li>
                    <h2><span>Slide 1</span></h2>
                    <div>
                      <figure>
                        <img class="full" src="http://i.imgur.com/SHaqP.jpg" alt="image" />
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>Slide 2</span></h2>
                    <div>
                      <figure>
                        <img class="full" src="http://i.imgur.com/v5LuU.jpg" alt="image" />
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>Slide 3</span></h2>
                    <div>
                      <figure>
                        <img class="full" src="http://i.imgur.com/VdDge.jpg" alt="image" />
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>Slide 4</span></h2>
                    <div>
                      <figure>
                        <img class="full" src="http://i.imgur.com/EwuD0.jpg" alt="image" />
                      </figure>
                    </div>
                </li>
                <li>
                    <h2><span>Slide 5</span></h2>
                    <div>
                      <figure>
                        <img class="full" src="http://i.imgur.com/Wl1P6.jpg" alt="image" />
                      </figure>
                    </div>
                </li>
            </ol>
        </div>
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Un code pour la PA accordéon

Message par Aryaline Dim 3 Mar 2013 - 18:47

Oui tu le met dans le message d'accueil.
Je t'ai mis le début :

Code:
<div id="accordeon-pa" class="accordion">
                    <ol>
                        <li>
                            <h2><span>Bienvenue</span></h2>
                            <div>
                              <figure>
                                <img class="full" src="http://i.imgur.com/SHaqP.jpg" alt="image" />
                              </figure>
                            </div>
                        </li>
                        <li>
                            <h2><span>Contexte</span></h2>
                            <div>
                              <figure>
                                <img class="full" src="http://i.imgur.com/v5LuU.jpg" alt="image" />
                              </figure>
                            </div>
                        </li>
                        <li>
                            <h2><span>News du forum</span></h2>
                            <div>
                              <figure>
                                <img class="full" src="http://i.imgur.com/VdDge.jpg" alt="        <table><tr><td>
        <div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;""><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></td><td><div style="margin-left:25px">
        <div style="width: 450px; height:150; background-color: indianred; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;"><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">Legi, Patres colendissimi, in Arabum monumentis, interrogatum Abdalam 1 Sarracenum, quid in hac quasi mundana scaena admirandum maxime spectaretur, nihil spectari homine admirabilius respondisse. Cui sententiae illud Mercurii adstipulatur: Magnum, o Asclepi, miraculum est homo 2. </div></div></div></tr></td></table>" />
                              </figure>
                            </div>
                        </li>
                        <li>
                            <h2><span>Personnage préfédinit</span></h2>
                            <div>
                              <figure>
                                <img class="full" src="http://i.imgur.com/EwuD0.jpg" alt="image" />
                              </figure>
                            </div>
                        </li>
                        <li>
                            <h2><span>Slide 5</span></h2>
                            <div>
                              <figure>
                                <img class="full" src="http://i.imgur.com/Wl1P6.jpg" alt="image" />
                              </figure>
                            </div>
                        </li>
                    </ol>
                </div>


Vous pouvez changer dedans les "Slide #" qui seront les titres des slides et remplacer les <img class="full" src="https://i.imgur.com/{...}.jpg" alt="image" /> par le html que vous voulez.
Aryaline

Aryaline
*

Féminin
Messages : 42
Inscrit(e) le : 15/01/2008

http://noblebourg.forumactif.org/
Aryaline a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Jézebel L. Dim 3 Mar 2013 - 18:56

Super !! Merci beaucoup Aryaline !! Very Happy

Prob résolu !!!!!!!!! Mr. Green



Dernière édition par Jézebel L. le Dim 3 Mar 2013 - 19:00, édité 1 fois
Jézebel L.

Jézebel L.
****

Féminin
Messages : 206
Inscrit(e) le : 02/05/2011

https://hiddenworld.forumsrpg.com/
Jézebel L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Un code pour la PA accordéon

Message par Aryaline Dim 3 Mar 2013 - 18:58

De rien, y as pas de quoi. N'oublie pas de mettre résolu dans ton titre en haut.
Aryaline

Aryaline
*

Féminin
Messages : 42
Inscrit(e) le : 15/01/2008

http://noblebourg.forumactif.org/
Aryaline a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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