Un code pour la PA accordéon

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. le 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.
****

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

http://monde-oublie.forumactif.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. le Jeu 14 Fév 2013 - 16:02

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

http://forum.forumactif.com/t327581-message-d-accueil-en-accordeon?highlight=panneau+accord%E9on

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Ven 15 Fév 2013 - 16:41

SVP
up !

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Lun 18 Fév 2013 - 15:45

SVP !!!

Up ! u_u

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Mar 19 Fév 2013 - 20:24

Personne ? OO

Up !

Jézebel L.
****

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

http://monde-oublie.forumactif.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 le 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
**

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. le 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 :



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.
****

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

http://monde-oublie.forumactif.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. le Lun 25 Fév 2013 - 14:45

Up ! svp -_-

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Mar 26 Fév 2013 - 20:27

Up !!!

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Mer 27 Fév 2013 - 22:21

UP !!

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Jeu 28 Fév 2013 - 16:51

SVP UP !

Jézebel L.
****

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

http://monde-oublie.forumactif.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. le Sam 2 Mar 2013 - 18:50

svp ? Quelqu'un ?

Up ! Sad

Jézebel L.
****

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

http://monde-oublie.forumactif.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 le 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
*

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 le 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
**

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. le Dim 3 Mar 2013 - 18:26

Kikou !

Merci d'avoir répondu !!!

Mais je le met où le code ? stp ^^'

Jézebel L.
****

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

http://monde-oublie.forumactif.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 le 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
*

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. le 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.
****

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

http://monde-oublie.forumactif.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 le 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="http://i.imgur.com/{...}.jpg" alt="image" /> par le html que vous voulez.

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. le 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.
****

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

http://monde-oublie.forumactif.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 le 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
*

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


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