Centrer mes images dans le Message d'accueil en accordéon

Page 1 sur 2 1, 2  Suivant

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

Résolu Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Dim 5 Jan 2014 - 20:22

Bonsoir,

Je voudrais savoir comment je peux centrer mes images dans le Message d'accueil en accordéon ?

- l'URL du forum, si nécessaire, http://www.petitefeuille.net/
- la version de votre forum, phpBB2 (subsilver)
- une capture d'écran du problème (Comment faire ?),

- votre statut sur le forum (fondateur, ou non), Fondatrice
- si vous avez modifié des templates (Si oui, le(s)quel(s)), oui
- si vous avez du CSS personnalisé, oui
- votre ou vos navigateur(s). Firefox et Chrome
- Le code qui pose problème surement dans le HTML mais je ne sais pas comment faire.

Merci d'avance,

Bonne soirée

petitefeuille


Dernière édition par petitefeuille le Mer 8 Jan 2014 - 14:49, édité 1 fois

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:24

Bonjour,

Une personne pourrait-elle m'aider s'il vous plait ?

Merci d'avance

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 13:25

Hello,
Tout simplement en mettant comme ceci <center><img src=""></center>

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:31

Oh tout simplement ? merci je vais essayer de suite je reviens Wink

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:36

en effet c'est parfait, mais mon problème en fait je croyais que c'était le centrage, mais c'est le"recadrage" de l'image qu'il me faudrait? l'image se montre une fois trop petite ou trop grande. Comment faire pour que les images soient dans la totalité du cadre ?

Merci d'avance

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 13:39

Il suffit de mettre comme ceci
<img src="" width="00px" height="00px">
Et tu mets les valeurs voulues

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:47

~ Nico ~ vous êtes adorable Smile je vous remercie de me répondre aussi vite Wink donc je vais le faire, mais encore une dernière question, comment je peux connaître les valeurs à mettre ?? (désolée, je ne suis pas très douée )

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 13:49

Peut tu me le code de ta PA stp que je regarde

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:50

tout à fait:)


Code:
<div id="accordeon-pa" class="accordion">
   
   <ol>
      
      <li>
         
         <h2>
             <span> Irak avec l'assaut sur Fallouja</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4906-irak-avec-l-assaut-sur-fallouja-le-risque-de-l-amalgame" title="titre"></a></figure>
            <center style="">
                <img class="full" src="http://www.world-lolo.com/images/uploads/image.num1389011662.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4906-irak-avec-l-assaut-sur-fallouja-le-risque-de-l-amalgame" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Disparition des cabines téléphoniques ?!</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4897-vers-la-disparition-des-cabines-telephoniques" title="titre"></a></figure>
            <center style="">
                <img class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/A27at.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4897-vers-la-disparition-des-cabines-telephoniques" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Le Nord des Etats-Unis ...</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4898-le-nord-des-etats-unis-se-prepare-a-subir-un-froid-record" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/8exjY.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4898-le-nord-des-etats-unis-se-prepare-a-subir-un-froid-record" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Le partage, c’est chic !</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4899-le-partage-cest-chic" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/P4ydD.jpg" />
            </center><figure><a href="http://www.petitefeuille.net/t4899-le-partage-cest-chic" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>gifs « stéréographiques »</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4900-des-gifs-stereographiques-de-dain-fagerholm-la-3d-sans-lunettes" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/DTF4.gif" />
            </center><figure><a href="http://www.petitefeuille.net/t4900-des-gifs-stereographiques-de-dain-fagerholm-la-3d-sans-lunettes" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Artiste crée des pièces uniques d'art</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4854-artiste-cree-des-pieces-uniques-d-art-en-utilisant-du-ruban-juste-emballage" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.world-lolo.com/images/uploads/image.num1388683670.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4854-artiste-cree-des-pieces-uniques-d-art-en-utilisant-du-ruban-juste-emballage" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>2014 sera-t-elle l'année de l'optimisme ?</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4903-etes-vous-optimiste-pour-l-annee-2014" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/e5G6W.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4903-etes-vous-optimiste-pour-l-annee-2014" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Taxis;service de nuit risqué et concurrence</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4835-taxis-service-de-nuit-risque-et-concurrence" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.world-lolo.com/images/uploads/image.num1388406500.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4835-taxis-service-de-nuit-risque-et-concurrence" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Michael Schumacher</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4831-michael-schumacher-grievement-blesse-dans-un-accident-de-ski" title="titre"></a></figure>
            <center style="">
               <img class="full" src="http://www.world-lolo.com/images/uploads/image.num1388405234.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4831-michael-schumacher-grievement-blesse-dans-un-accident-de-ski" title="titre"></a></figure>
         </div>
         
      </li>
      
   </ol>
</div>

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 13:52

Il faut que tu regarde ton CSS et les valeurs du width & height sont dedans

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 13:56

la dedans ?? mais pas facile de voir

Code:
  /*************************************************!
    *
    *  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 }

    /****************************************** Dark */
    .accordion {
        border: 9px solid #353535;
        border-bottom-width: 8px;
        padding: 5px 5px 6px 0;
        background: #030303;
        -webkit-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -moz-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -ms-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
        -o-box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
      box-shadow: 0 -1px 0 #5b5b5b inset, 0 5px 15px rgba(0, 0, 0, 0.4);
    }
    .accordion .slide > h2 { background: #030303; text-shadow: 0 -1px 0 #030303; line-height: 265% }
    .accordion .slide > h2 span { background: #353535; color: white }
    .accordion .slide > h2 b { background: #353535; color: #030303; text-shadow: -1px 1px 0 #5b5b5b }
    .accordion .slide > h2.selected span, .accordion .slide > h2.selected span:hover {
        background: #353535;
        background: -moz-linear-gradient(left,  #353535 0%, #555555 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#353535), color-stop(100%,#555555));
        background: -webkit-linear-gradient(left,  #353535 0%,#555555 100%);
        background: -o-linear-gradient(left,  #353535 0%,#555555 100%);
        background: -ms-linear-gradient(left,  #353535 0%,#555555 100%);
        background: linear-gradient(left,  #353535 0%,#555555 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#353535', endColorstr='#555555',GradientType=1 );
    }
    .accordion .slide > h2.selected b {
        background: #383838;
        background: -moz-linear-gradient(top,  #3a3a3a 0%, #363636 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3a3a3a), color-stop(100%,#363636));
        background: -webkit-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: -o-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: -ms-linear-gradient(top,  #3a3a3a 0%,#363636 100%);
        background: linear-gradient(top,  #3a3a3a 0%,#363636 100%);
    }
    .accordion .slide > div { background: #030303; 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% }
    .ie9.accordion .slide > h2.selected span, .ie9.accordion .slide > h2.selected span:hover { filter: none }

    /******************************************** FA */
    .accordion figure .full { width: 100%; height: 100%; }
    .accordion h2 { border: none; }

    /* centrer l'accordéon */
    .accordion { margin: auto; }
        /*()Bouton avertissement rapide */
       
        .mod_mess, .adm_mess {
        margin: 5px auto;
        width: 90%;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        }
       
        .mod_mess a.postlink, .adm_mess a.postlink {
        color: #FFF !important;
        text-decoration: underline !important;
        }
       
        /* administrateur bb-Code - bloc de message d'enregistrement */
       
        .adm_mess {
        background: #e54858;
        background: -moz-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e54858), color-stop(100%, #f5b57a));
        background: -webkit-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -o-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -ms-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: linear-gradient(left, #e54858 0%, #f5b57a 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e54858", endColorstr="#f5b57a", GradientType=1);
        -webkit-box-shadow: 4px 4px 0px 0px #352727;
        -moz-box-shadow: 4px 4px 0px 0px #352727;
        box-shadow: 4px 4px 0px 0px #352727;
        }
       
        /* Administrateur bb-Code - mise en page */
        .adm_mess .titl {
        font-size: 15px;
        font-weight: bold;
        padding: 5px;
        border-bottom: 1px dashed #B60505; 
        }
           
        /* Administrateur BB-Code - présentation du texte */
        .adm_mess .titl + div {
        display: block;
        margin-left: 10px;
        padding: 25px 5px 25px 80px;
        background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome-10.png) no-repeat left center;
        }
       
        /* Messages BB-Code - bloc de message d'enregistrement */
       
        .mod_mess {
        background: #5c93f5;
        background: -moz-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5c93f5), color-stop(100%, #afcfda));
        background: -webkit-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -o-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -ms-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5c93f5", endColorstr="#afcfda", GradientType=1);
        -webkit-box-shadow: 4px 4px 0px 0px #352727;
        -moz-box-shadow: 4px 4px 0px 0px #352727;
        box-shadow: 4px 4px 0px 0px #352727;
        }
       
        /* Messages BB-Code - Un titre */
        .mod_mess .titl {
        font-size: 15px;
        font-weight: bold;
        padding: 5px;
        border-bottom: 1px dashed #0D4DD3;   
        }
           
        /* modernité BB-Code - présentation du texte */
        .mod_mess .titl + div {
        display: block;
        margin-left: 10px;
        padding: 25px 5px 25px 80px;
        background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome610.png) no-repeat left center; 
        }
          .signature_div img{
            max-width: 488px !important;
            max-height: 203px !important;
            }


petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:00

Met
@~ Nico ~ a écrit:<img src="" width="100%" height="100%">
Et dis moi si ça fonctionne

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:01

oui attends merci Smile

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:04

J'attends Wink

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:12

ouh la non !!! ça me met en très très grand pour certaine

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:15

Pour l'image il va falloir que tu varies le pourcentage des valeurs de l'image

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:16

d'accord je vais essayer

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:19

Y'a-t-il un code java avec la PA ou pas ? Si oui peut-tu me le passer pour que je regarde stp

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:28

@~ Nico ~ a écrit:Y'a-t-il un code java avec la PA ou pas ? Si oui peut-tu me le passer pour que je regarde stp

Code:
$(document).ready(function() {
          $("#accordeon-pa").each(function(){
            $(this).liteAccordion({
              autoPlay:true,
              pauseOnHover:true,
              rounded:true,
              enumerateSlides:true,
              containerWidth: 960,
              containerHeight: 320
            })
          });
        });
        /*************************************************!
        *
        *  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
        *
        **************************************************/
        (function(b){var a=function(g,l){var i={headerWidth:48,activateOn:"click",firstSlide:1,slideSpeed:800,onTriggerSlide:function(){},onSlideAnimComplete:function(){},autoPlay:false,pauseOnHover:false,cycleSpeed:6000,easing:"swing",theme:"basic",rounded:false,enumerateSlides:false,linkable:false},h=b.extend({},i,l),c=g.children("ol").children("li"),j=c.children(":first-child"),k=c.length,f=h.containerWidth-k*h.headerWidth,e={play:function(m){var n=d.nextSlide(m&&m);if(d.playing){return}d.playing=setInterval(function(){j.eq(n()).trigger("click.liteAccordion")},h.cycleSpeed)},stop:function(){clearInterval(d.playing);d.playing=0},next:function(){e.stop();j.eq(d.currentSlide===k-1?0:d.currentSlide+1).trigger("click.liteAccordion")},prev:function(){e.stop();j.eq(d.currentSlide-1).trigger("click.liteAccordion")},destroy:function(){e.stop();b(window).unbind(".liteAccordion");g.attr("style","").removeClass("accordion basic dark light stitch").removeData("liteAccordion").unbind(".liteAccordion").find("li > :first-child").unbind(".liteAccordion").filter(".selected").removeClass("selected").end().find("b").remove();c.removeClass("slide").children().attr("style","")},debug:function(){return{elem:g,defaults:i,settings:h,methods:e,core:d}}},d={setStyles:function(){g.width(h.containerWidth).height(h.containerHeight).addClass("accordion").addClass(h.rounded&&"rounded").addClass(h.theme);c.addClass("slide").children(":first-child").width(h.containerHeight).height(h.headerWidth).eq(h.firstSlide-1).addClass("selected");j.each(function(m){var p=b(this),o=m*h.headerWidth,n=j.first().next(),q=parseInt(n.css("marginLeft"),10)||parseInt(n.css("marginRight"),10)||0;if(m>=h.firstSlide){o+=f}p.css("left",o).next().width(f-q).css({left:o,paddingLeft:h.headerWidth});h.enumerateSlides&&p.append("<b>"+(m+1)+"</b>")})},bindEvents:function(){if(h.activateOn==="click"){j.bind("click.liteAccordion",d.triggerSlide)}else{if(h.activateOn==="mouseover"){j.bind({"mouseover.liteAccordion":d.triggerSlide,"click.liteAccordion":d.triggerSlide})}}if(h.pauseOnHover&&h.autoPlay){g.bind("mouseover.liteAccordion",function(){d.playing&&e.stop()}).bind("mouseout.liteAccordion",function(){!d.playing&&e.play(d.currentSlide)})}},linkable:function(){var m=(function(){var o=[];c.each(function(){if(b(this).attr("name")){o.push((b(this).attr("name")).toLowerCase())}});return m=o})();var n=function(p){var o;if(p.type==="load"&&!window.location.hash){return}if(p.type==="hashchange"&&d.playing){return}o=b.inArray((window.location.hash.slice(1)).toLowerCase(),m);if(o>-1&&o<m.length){j.eq(o).trigger("click.liteAccordion")}};b(window).bind({"hashchange.liteAccordion":n,"load.liteAccordion":n})},currentSlide:h.firstSlide-1,nextSlide:function(m){var n=m+1||d.currentSlide+1;return function(){return n++%k}},playing:0,animSlideGroup:function(m,o,n){var p=n?":lt("+(m+1)+")":":gt("+m+")";c.filter(p).each(function(){var r=b(this),q=c.index(r);r.children().stop(true).animate({left:(n?0:f)+q*h.headerWidth},h.slideSpeed,h.easing,function(){if(!d.slideAnimCompleteFlag){h.onSlideAnimComplete.call(o);d.slideAnimCompleteFlag=true}})})},slideAnimCompleteFlag:false,triggerSlide:function(p){var o=b(this),m=j.index(o),n=o.next();d.currentSlide=m;d.slideAnimCompleteFlag=false;j.removeClass("selected").filter(o).addClass("selected");if(p.originalEvent&&h.autoPlay){e.stop();e.play(m)}if(h.linkable&&!d.playing){window.location.hash=o.parent().attr("name")}h.onTriggerSlide.call(n);d.animSlideGroup(m,n,true);d.animSlideGroup(m,n)},ieClass:function(){var m=+(b.browser.version).charAt(0);if(m<7){e.destroy()}if(m===7||m===8){c.each(function(n){b(this).addClass("slide-"+n)})}g.addClass("ie ie"+m)},init:function(){if(b.browser.msie){d.ieClass()}d.setStyles();d.bindEvents();if(h.cycleSpeed<h.slideSpeed){h.cycleSpeed=h.slideSpeed}if(h.linkable&&"onhashchange" in window){d.linkable()}h.autoPlay&&e.play()}};d.init();return e};b.fn.liteAccordion=function(e){var d=this,c=d.data("liteAccordion");if(typeof e==="object"||!e){return d.each(function(){var f;if(c){return}f=new a(d,e);d.data("liteAccordion",f)})}else{if(typeof e==="string"&&c[e]){if(e==="debug"){return c[e].call(d)}else{c[e].call(d);return d}}}}})(jQuery);

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:29

Je te remercie et regarde à ça
Tu peux me dire c'est quelles photos qu'il faut redimensionner ?

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:32

en fait à part la première toutes .. voici mes modifs

Code:
<div id="accordeon-pa" class="accordion">
   
   <ol>
      
      <li>
         
         <h2>
             <span> Irak avec l'assaut sur Fallouja</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4906-irak-avec-l-assaut-sur-fallouja-le-risque-de-l-amalgame" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.world-lolo.com/images/uploads/image.num1389011662.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4906-irak-avec-l-assaut-sur-fallouja-le-risque-de-l-amalgame" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Disparition des cabines téléphoniques ?!</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4897-vers-la-disparition-des-cabines-telephoniques" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 150%;" class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/A27at.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4897-vers-la-disparition-des-cabines-telephoniques" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Le Nord des Etats-Unis ...</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4898-le-nord-des-etats-unis-se-prepare-a-subir-un-froid-record" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/8exjY.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4898-le-nord-des-etats-unis-se-prepare-a-subir-un-froid-record" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Le partage, c’est chic !</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4899-le-partage-cest-chic" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/P4ydD.jpg" />
            </center><figure><a href="http://www.petitefeuille.net/t4899-le-partage-cest-chic" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>gifs « stéréographiques »</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4900-des-gifs-stereographiques-de-dain-fagerholm-la-3d-sans-lunettes" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/DTF4.gif" />
            </center><figure><a href="http://www.petitefeuille.net/t4900-des-gifs-stereographiques-de-dain-fagerholm-la-3d-sans-lunettes" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Artiste crée des pièces uniques d'art</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4854-artiste-cree-des-pieces-uniques-d-art-en-utilisant-du-ruban-juste-emballage" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.world-lolo.com/images/uploads/image.num1388683670.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4854-artiste-cree-des-pieces-uniques-d-art-en-utilisant-du-ruban-juste-emballage" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>2014 sera-t-elle l'année de l'optimisme ?</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4903-etes-vous-optimiste-pour-l-annee-2014" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.evolutiongraph.fr/chevereto/images/2014/01/05/e5G6W.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4903-etes-vous-optimiste-pour-l-annee-2014" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Taxis;service de nuit risqué et concurrence</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4835-taxis-service-de-nuit-risque-et-concurrence" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.world-lolo.com/images/uploads/image.num1388406500.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4835-taxis-service-de-nuit-risque-et-concurrence" title="titre"></a></figure>
         </div>
         
      </li>
      
      <li>
         
         <h2>
             <span>Michael Schumacher</span>
         </h2>
         
         <div>
             <figure><a href="http://www.petitefeuille.net/t4831-michael-schumacher-grievement-blesse-dans-un-accident-de-ski" title="titre"></a></figure>
            <center style="">
                <img style="width: 100%; height: 100%;" class="full" src="http://www.world-lolo.com/images/uploads/image.num1388405234.of.world-lolo.com.jpg" alt="image" />
            </center><figure><a href="http://www.petitefeuille.net/t4831-michael-schumacher-grievement-blesse-dans-un-accident-de-ski" title="titre"></a></figure>
         </div>
         
      </li>
      
   </ol>
   
</div>

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:36

Est-ce que c'est ce que tu voulais http://lyoko.forumactif.org/ ?

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:39

oui mais tu peux voir que les images ne sont pas tous bien dans le cadre, il faudrait laisser comme même une marge en haut et bas et sur les côtés Smile

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:39

Elles sont dans le cadres et elles prennent tout le cadres ce que tu voulais

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:41

pas trop car l'image est tronqué  Confused 

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:41

Tronqué ?

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:44

oui, elle ne sont pas entière si tu veux Smile comme celle ci : http://www.evolutiongraph.fr/chevereto/images/2014/01/05/e5G6W.jpg

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:45

Pour celle-ci on peut pas faire grand chose que la laisse comme elle est originalement ou alors il faut que tu les réduisent on peut pas faire mieux


Dernière édition par ~ Nico ~ le Mer 8 Jan 2014 - 14:47, édité 1 fois

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par petitefeuille le Mer 8 Jan 2014 - 14:47

ah bon !! bon bé écoute merci de ton aide Smile et de ta patience  sunny 

Bonne fin d'après midi

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Centrer mes images dans le Message d'accueil en accordéon

Message par ~ Nico ~ le Mer 8 Jan 2014 - 14:47

Ou alors il faut que tu les réduisent on peut pas faire mieux

~ Nico ~
**

Masculin
Messages : 83
Inscrit(e) le : 10/04/2013

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

Page 1 sur 2 1, 2  Suivant

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