AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

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 onglets à divers effets (au survol, rotation ...)

    Partagez
    Halloween
    FémininAge : 22Messages : 9733

    le Dim 27 Avr 2014 - 15:06

    Plop,

    Suite à une demande voici le LS qui en découle.

    Les aperçus n'ont pas été simples à prendre, pour le premier onglet j'ai essayé de prendre tous les effets qui découlent du passage de la souris sur l'élément. L'image disparait entièrement pour le contexte.

    Page d'accueil


    Version  phpBB2 ▬ CSS & HTML ▬ Rotations, changement de couleurs, défilement, opacité ...

    Aperçu ▬ Onglet 1 Onglet 2 Onglet 3


    PA
    Code:

    <div style="padding: 25px;">
     <script type="text/javascript">
                //<!--
                        function change_paonglet(name)
                        {
                                document.getElementById('paonglet_'+anc_paonglet).className = 'paonglet_0 paonglet';
                                document.getElementById('paonglet_'+name).className = 'paonglet_1 paonglet';
                                document.getElementById('contenu_paonglet_'+anc_paonglet).style.display = 'none';
                                document.getElementById('contenu_paonglet_'+name).style.display = 'block';
                                anc_paonglet = name;
                        }
                //-->
                </script>
    <div class="paonglets">
     <span class="paonglet_0 paonglet" id="paonglet_informations" onclick="javascript:change_paonglet('informations');">Informations</span> <span class="paonglet_0 paonglet" id="paonglet_contact" onclick="javascript:change_paonglet('contact');">Contact & Liens pratiques</span> <span class="paonglet_0 paonglet" id="paonglet_liens" onclick="javascript:change_paonglet('liens');">Liens externes</span>
    </div><br />
    <div class="contenu_paonglets">
     
    <div class="contenu_paonglet" id="contenu_paonglet_informations">
     
    <table>
     
    <tbody>
     
    <tr>
     
    <td>
     
    <center>
     
    <div class="titre_pa">
     Nouveautés
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 250px; height: 380px;">
     
    <center>
     
    <div style="width: 240px; height: 220px; overflow: auto; text-align: justify;">
     <span style="color: #70A0BA;">✂</span> Nouveauté : ceci est un texte complètement inutile, oui oui u.u Et si tu es maso, tu peux consulter la suite. <a href="#">www</a><br /><br /><span style="color: #70A0BA;">✂</span> Nouveauté : ceci est un texte complètement inutile, oui oui u.u Et si tu es maso, tu peux consulter la suite. <a href="#">www</a><br /><br /><span style="color: #70A0BA;">✂</span> Nouveauté : ceci est un texte complètement inutile, oui oui u.u Et si tu es maso, tu peux consulter la suite. <a href="#">www</a><br /><br /><span style="color: #70A0BA;">✂</span> Nouveauté : ceci est un texte complètement inutile, oui oui u.u Et si tu es maso, tu peux consulter la suite. <a href="#">www</a><br /><br /><span style="color: #70A0BA;">✂</span> Nouveauté : ceci est un texte complètement inutile, oui oui u.u Et si tu es maso, tu peux consulter la suite. <a href="#">www</a><br /><br />
    </div><br /><iframe style="width: 240px;" src="//www.youtube.com/embed/C-W40iW2MRs" allowfullscreen="" frameborder="0"></iframe>
    </center>
     
    </div>
     
    </td>
     
    <td style="width: 30px;">
     
    </td>
     
    <td>
     
    <center>
     
    <div class="titre_pa">
     Contexte
    </div>
     
    </center>
     
    <div class="contexte">
     
    <div class="contexte_img">
     <img src="http://i57.servimg.com/u/f57/18/47/68/10/2610.png" />
    </div>
     
    <div class="contexte_description">
     Nec minus feminae quoque calamitatum participes fuere similium. nam ex hoc quoque sexu peremptae sunt originis altae conplures, adulteriorum flagitiis obnoxiae vel stuprorum. inter quas notiores fuere Claritas et Flaviana, quarum altera cum duceretur ad mortem, indumento, quo vestita erat, abrepto, ne velemen quidem secreto membrorum sufficiens retinere permissa est. ideoque carnifex nefas admisisse convictus inmane, vivus exustus est. Altera templo insulam et insignis viribus claram viribus Salamis supremos et ipso committat armamentis tamque claram crebra ad indigens externi instructam ut abundat omnibusque onerariam continenti templo rerum a tanta municipia autem discretam insignis portuosam municipia continenti duae inter ut Cyprus omnium omnium Salamis a indigens urbes portuosam et claram tanta nullius ad rerum discretam fundamento Veneris claram rerum mari itidem Cyprus Cyprus Salamis urbes Paphus Cyprus continenti et Cyprus templo altera et municipia altera externi carbasos claram altera aedificet templo eadem Cyprus tamque itidem delubris a tamque et Paphus procul Paphus Paphus nullius Veneris armamentis adminiculi continenti tanta carbasos. Altera templo insulam et insignis viribus claram viribus Salamis supremos et ipso committat armamentis tamque claram crebra ad indigens externi instructam ut abundat omnibusque onerariam continenti templo rerum a tanta municipia autem discretam insignis portuosam municipia continenti duae inter ut Cyprus omnium omnium Salamis a indigens urbes portuosam et claram tanta nullius ad rerum discretam fundamento Veneris claram rerum mari itidem Cyprus Cyprus Salamis urbes Paphus Cyprus continenti et Cyprus templo altera et municipia altera externi carbasos claram altera aedificet templo eadem Cyprus tamque itidem delubris a tamque et Paphus procul Paphus Paphus nullius Veneris armamentis adminiculi continenti tanta carbasos. <a href="#">La suite</a>
    </div>
     
    </div>
     
    <div style="clear: both;">
     
    </div><br />
    <center>
     
    <div class="titre_pa">
     Nos fidèles
    </div>
     
    <div class="bloc_pa" style="width: 350px; height: 100px;">
     
    <center>
     
    <table>
     
    <tbody>
     
    <tr>
     
    <td>
     <d class="info"><img src="http://i57.servimg.com/u/f57/18/47/68/10/8910.png" class="imgwidget" /><span><e style="COLOR: #f0f0f0 !important; FONT-SIZE: 18px !important" class="titrePA1">Pseudo</e> <br />Blabla description par ici, youpi ! <a href="#">Lien</a></span></d>
    </td>
     
    <td style="width: 40px;">
     
    </td>
     
    <td>
     <d class="info"><img src="http://i57.servimg.com/u/f57/18/47/68/10/8910.png" class="imgwidget" /><span><e style="COLOR: #f0f0f0 !important; FONT-SIZE: 18px !important" class="titrePA1">Pseudo</e> <br />Blabla description par ici, youpi ! <a href="#">Lien</a></span></d>
    </td>
     
    </tr>
     
    </tbody>
     
    </table>
     
    </center>
     
    </div>
     
    </center>
     
    </td>
     
    </tr>
     
    </tbody>
     
    </table>
     
    </div>
     
    <div class="contenu_paonglet" id="contenu_paonglet_contact">
     
    <table>
     
    <tbody>
     
    <tr>
     
    <td>
     
    <center>
     
    <div class="titre_pa">
     Prédéfinis
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 350px; height: 200px;">
     
    <center>
     <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c><br /><c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c>
    </center>
     
    </div>
     
    </td>
     
    <td>
     
    <center>
     
    <div class="titre_pa">
     Liens pratiques
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 300px; height: 200px;">
     <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a> <a href="#">Lien </a>
    </div>
     
    </td>
     
    </tr>
     
    </tbody>
     
    </table>
     
    <center>
     
    <div class="titre_pa">
     Staff
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 600px; padding: 9px !important;">
     
    <center>
     <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c> <c class="info"><img src="http://img11.hostingpics.net/pics/686120esaaaaa3.jpg" class="imgPA" /><span><br /><br /><d style="COLOR: #f0f0f0 !important; FONT-SIZE: 17px !important" class="titrePA1">Emma Swan</d> <br /><a href="#">Sa fiche</a></span></c>
    </center>
     
    </div>
     
    </div>
     
    <div class="contenu_paonglet" id="contenu_paonglet_liens">
     
    <center>
     
    <div class="titre_pa">
     Partenaires
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 500px; height: 150px;">
     
    <center>
     <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a><br /><a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a><br /><a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a><br /><a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a>
    </center>
     
    </div><br />
    <center>
     
    <div class="titre_pa">
     Tops-sites
    </div>
     
    </center>
     
    <div class="bloc_pa" style="width: 500px; height: 80px;">
     
    <center>
     <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a><br /><a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a> <a href="#"><img src="http://img15.hostingpics.net/pics/253520bouton2.jpg" class="img_partenaires" /></a>
    </center>
     
    </div>
     <a href="http://www.never-utopia.com" style="color: #FCE7AE !important; position: relative; float: right;">© Halloween</a>
    </div>
     
    </div>
     <script type="text/javascript">
                //<!--
                        var anc_paonglet = 'informations';
                        change_paonglet(anc_paonglet);
                //-->
                </script>
    </div><link href="http://fonts.googleapis.com/css?family=Pacifico" rel="stylesheet" type="text/css" />



    CSS
    Code:
    /*********************************** PA ***********************************/

    /*** PARTENAIRES ET TOPS ***/
    .img_partenaires {
      opacity: 0.5;
    }

    .img_partenaires:hover {
      opacity: 1;
    }



    /*** IMAGES DU STAFF ***/

    .imgPA {
      border-radius: 50%;
      width: 100px;
      height: 100px;
    }

    .info {
      position: relative;
      z-index: 24;
      text-decoration: none;
    }
     
    c.info:hover {
      z-index: 25;
    }
     
    c.info span {
      display: none;
    }
     
    c.info:hover span {
      display: block;
      position: absolute;
      top: -9.3em;
     left: -0.3em;
      border-radius: 50%;
      width: 105px;
      height: 105px;
      background-color: #0D0D0D;
      color: #F3F3F3;
      text-align: center;
      font-weight: none;
    }



    /*** IMAGES DES PREDEFINIS ***/
    .imgwidget {
      border-radius: 50%;
      width: 100px;
      height: 100px;
      -moz-transition-duration: 1s;
      -moz-transition-timing-function: linear;
      -webkit-transition-duration: 1s;
      -webkit-transition-timing-function: linear;
      transition-duration: 1s;
      transition-timing-function: linear;
    }

    .imgwidget:hover {
      border-radius: 50%;
      width: 100px;
      height: 100px;
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }

    .info {
      position: relative;
      z-index: 24;
      text-decoration: none;
    }

    d.info:hover {
      z-index: 25;
    }
     
    d.info span {
      display: none;
    }
     
    d.info:hover span {
      display: block;
      position: absolute;
      top: -2em;
     left: -2em;
      width: 140px;
      height: 50px;
      overflow: auto;
      background-color: #0D0D0D;
      color: #F3F3F3;
      text-align: center;
      font-weight: none;
    }



    /*** EFFET DU CONTEXTE ***/

    .contexte {
      width: 400px;
      height: 200px;
      overflow: hidden;
      background-color: #333333;
      border-radius: 25px;
      position: relative;
      top: -2.2em;
    }
        
    .contexte_img {
      position: relative;
      z-index: 2;
      width: 400px;
      height: 200px;
      margin-left: 0px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      -transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }

    .contexte:hover .contexte_img {
      margin-top: -200px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }
        
    .contexte_description {
      position: relative;
      z-index: 1;
      width: 350px;
      height: 140px;
      color: #F3F3F3;
      padding: 25px;
      text-align: justify !important;
      font-size: 11px;
      overflow: auto;
    }

    .contexte_description a {
      text-decoration: none !important;
    }



    /*** SYSTEME D'ONGLETS ***/

    .paonglet {
      display: inline-block;
      margin-left: 20px;
      margin-right: 20px;
      padding: 10px;
      cursor: pointer;
      background-color: #333333;
      color: #FCE7AE;
    }
                
    .paonglet_0 {
      border-radius: 25px;
    }

    .paonglet_1 {
      border-radius: 25px;
      color: #70A0BA;
    }

    .contenu_paonglet {
      padding: 25px;
      display: none;
      width: 780px;
      height: 450px;
      border-radius: 25px;
      background-color: #0D0D0D;
    }

    .contenu_paonglet a{
      text-decoration: none !important;
    }



    /*** BLOC DE TEXTE DE LA PA ***/

    .bloc_pa {
      background-color: #333333;
      border-radius: 25px;
      color: #F3F3F3;
      padding: 25px;
      text-align: justify !important;
      position: relative;
      top: -2.2em;
    }

    .bloc_pa a {
      text-decoration: none !important;
      color: #70A0BA !important;
    }

    /*** TITRES DES BLOCS ***/

    .titre_pa {
      font-family: 'Pacifico', 'cursive';
      font-size: 30px;
      position: relative;
      top: -0.3em;
      color: #F3F3F3;
      z-index: 1;
    }

    .titre_pa:hover {
      color: #70A0BA;
    }

    /*********************************** FIN PA ***********************************/






    Je mets les voiles, que le vent te soit favorable matelot !
    Cruelly
    FémininAge : 23Messages : 2469

    le Lun 28 Avr 2014 - 1:33

    Je crois que cette PA là est ma PRÉFÉRÉ de toute celle que tu a fais ! :)
    Franchement merci Halloween de nous donner accès a tes code qui sont tous plus beaux les uns que les autres :)



    Construction d'un forum en cours ! Vous pouvez me donner votre avis ou m'apporter votre soutiens dans mon WIP :hug:
    Halloween
    FémininAge : 22Messages : 9733

    le Lun 28 Avr 2014 - 12:57

    Merci à toi Cruelly pour tes commentaires toujours encourageants Wink



    Je mets les voiles, que le vent te soit favorable matelot !
    Cruelly
    FémininAge : 23Messages : 2469

    le Mar 29 Avr 2014 - 6:36

    C'est tu es mon/ma codeur/codeuse préféré ici :)
    J'ai très hâte de voir la suite (comme toujours :) )



    Construction d'un forum en cours ! Vous pouvez me donner votre avis ou m'apporter votre soutiens dans mon WIP :hug:
    Bruleciel
    FémininAge : 23Messages : 934

    le Mar 29 Avr 2014 - 13:58

    J'avoue que cette PA a une putain de gueule... Et qu'elle me tente grave !
    Merci à toi Halloween, toujours plus haut et plus loin \o



    Je brûle le ciel
    A-Lice
    FémininAge : 22Messages : 4939

    le Mar 29 Avr 2014 - 16:49

    C'est une magnifique PA, et surtout pas surchargée. Bravo !

    Piratress
    FémininAge : 19Messages : 188

    le Mar 29 Avr 2014 - 20:45

    Bravo, elle est très belle, j'aime beaucoup !
    Beau travail, je suis sous le charme ! :)
    Malice1329
    FémininAge : 28Messages : 78

    le Dim 4 Mai 2014 - 6:12

    Félicitation c'est formidable tout le travail que tu met sur tes codes. C'es tout simplement extraordinaire



    Zorume
    FémininAge : 20Messages : 84

    le Lun 5 Mai 2014 - 19:07

    O.O) WOW elle est superbe =D
    Damouny
    FémininAge : 20Messages : 37

    le Mar 6 Mai 2014 - 14:40

    C'est juste magique ce que tu fais *_*





    Love is danger, Blood is pleasure, Devil is pure, the only treasure
    Damouny
    The power of Devil, A force from above, Cleaning my soul, Flame on burn desire...


    (c) Damouny
    Susan Storm
    FémininAge : 37Messages : 77

    le Mar 6 Mai 2014 - 14:46

    Merci Very Happy
    Wolftactick
    FémininAge : 15Messages : 69

    le Mar 6 Mai 2014 - 20:09

    Jaime bien
    Etoile Du Phenix
    FémininAge : 13Messages : 14

    le Mar 6 Mai 2014 - 22:41

    magnifique *.*
    Tatia38
    FémininAge : 27Messages : 294

    le Mer 7 Mai 2014 - 15:19

    Superbe merci
    Raween
    FémininAge : 25Messages : 109

    le Mer 7 Mai 2014 - 20:41

    Merci beaucoup ^^
    Ellimac
    FémininAge : 19Messages : 7

    le Mer 7 Mai 2014 - 22:16

    C'est magnifique ! *-*
    Tu fais des miracles en codage ! Merci !! *-*
    Invité

    le Mer 7 Mai 2014 - 22:22

    oh *_*
    Merci beaucoup, j'adore ^^
    Lily-R
    FémininAge : 24Messages : 17

    le Jeu 8 Mai 2014 - 13:46

    Merci beaucoup pour ce partage <3 !
    Nyyvek
    MasculinAge : 26Messages : 34

    le Jeu 8 Mai 2014 - 15:57

    De très belle PA à chaque fois, rien à redire mais alors celle là *.*
    Edward Speleers
    FémininAge : 28Messages : 332

    le Jeu 8 Mai 2014 - 16:06

    elle est géniale, merci beaucoup



    Lisou
    FémininAge : 16Messages : 293

    le Jeu 8 Mai 2014 - 18:00

    Félicitation, elle est trop belle ♥ :facepalm: 
    Doctor Who
    MasculinAge : 23Messages : 160

    le Jeu 8 Mai 2014 - 20:53

    Merci beaucoup :)





    DOCTOR WHO ☼
    © Yamashita d'épicode
    LinaK
    FémininAge : 26Messages : 53

    le Jeu 8 Mai 2014 - 21:06

    @Halloween a écrit:Plop,

    Suite à une demande voici le LS qui en découle.

    Les aperçus n'ont pas été simples à prendre, pour le premier onglet j'ai essayé de prendre tous les effets qui découlent du passage de la souris sur l'élément. L'image disparait entièrement pour le contexte.

    Page d'accueil


    Version  phpBB2 ▬ CSS & HTML ▬ Rotations, changement de couleurs, défilement, opacité ...

    Aperçu ▬ Onglet 1 Onglet 2 Onglet 3







    J'aime énormément, je pense que je vais la prendre pour mon fofo (et la modifier un peu à ma sauce bien entendu ^^ ), mais un grand merci, je laisserai les crédits bien évidemment :)





    SugarBuse
    FémininAge : 18Messages : 42

    le Ven 9 Mai 2014 - 1:27

    Merci !
    Apokalip'z
    MasculinAge : 23Messages : 287

    le Ven 9 Mai 2014 - 17:56

    Merci Hallow' de partager ce que tu fais ^^
    Je surkiffe trop, c'est magnifique *_*



    Contenu sponsorisé

    Aujourd'hui à 22:17


      La date/heure actuelle est Jeu 19 Jan 2017 - 22:17