AccueilRechercherS'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.

-33%
Le deal à ne pas rater :
Antivol en U pour vélo avec câble [Vente Flasch]
13.05 € 19.56 €
Voir le deal

    PA gris/rose + infobulles + staff + news + partenaires défilants.

    Henrykiki
    Henrykiki
    MasculinAge : 28Messages : 576

    le Jeu 25 Déc 2014 - 21:44

    Rappel du premier message :

    Bonjour tout le monde,

    LS ~ PA gris/rose :


    Voici mon premier LS de PA suite à la demande de Madii-x, faite ici. Vous avez également le qeel ainsi que les catégories qui vont avec cette PA.

    Découvrez un aperçu de cette PA en ligne:
    www (avec intéractions)

    Et découvrez celle-ci en images :
    Normale- Infobulles- Survol nouveautés


    La PA contient en elle-même :

    • Une zone concours avec infobulles (peut être adaptée en membre du mois.
    • Une zone staff avec informations apparaissant au survol...
    • Une zone "nouveautés" scrollable et cliquable.
    • Un système de masquage automatique sur les images (effet déchiré).
    • Une zone "partenaires" défilante, aux normes du W3C + arrêt au survol.


    Les codes à insérer !


    Ce code-ci est à insérer dans une page html (PA>Modules>Pages HTML>Créer)

    Code:
    <!doctype html>
    <html lang="fr">
    <head>
            <meta charset="UTF-8" />
       <title>PA grise/rose + scrollbar personnalisée.</title>
       <link href='http://fonts.googleapis.com/css?family=Covered+By+Your+Grace' rel='stylesheet' type='text/css'>
       <style>

          body {
             background: #e4e1e2;
          }

          #pa h1, #pa h2, #pa h3, #pa h4, #pa h5, #pa h6, #pa p {
             margin: 0; padding: 0; font-weight: normal;
          }

          #pa {
             width: 800px;
             min-height: 400px;
             border-radius: 10px;
             background: #fff;
             margin: 75px auto 20px;
             position: relative;
             padding-top: 50px;
             font-family: "abeatbykai", sans-serif;
             font-size: 12px;
             letter-spacing: 1px;
             color: gray;
          }

          #pa a {
             color: darkgray;
             text-decoration: none;
          }

          #pa a, #pa h2, .news p {
             -webkit-transition: all .2s ease;
             -moz-transition: all .2s ease;
             -ms-transition: all .2s ease;
             -o-transition: all .2s ease;
             transition: all .2s ease;
          }

          #pa a:hover {
             color: #d74e77;
          }
          
          #pa h1 {
             width: 347px;
             height: 70px;
             background: url("http://i39.servimg.com/u/f39/19/07/10/81/titre-10.png") no-repeat;
             position: absolute;
             top: -55px;
             left: 50%;
             margin-left: -173.5px;
             text-indent: -9999px;
          }

          ul#ticker01, ul#concours, ul.groupes, ul#staff
          {
             list-style-type: none;
             margin: 0;
             padding: 0;
          }

          #pa h2 img {
             position: absolute; top:0;
          }

          #pa table td {
             min-height: 50px;
             border-radius: 10px;
             position: relative;
             padding-top: 25px;
          }

          #pa table td.withbg {
             background: #e4e1e2;
          }

          #pa h2 {
             height: 34px;
             position: absolute;
             top: -12.5px;
             z-index: 3;
             font-size: 34px;
             font-family: 'Covered By Your Grace', cursive;
          }

          #pa h2:hover {
             color: rgba(209,42,97,1);
          }

    /* CONCEPT */

          .concept {
             height: 192px; max-height: 192px;
             overflow-y: scroll;
             padding: 1px;
          }

          .concept p {
             margin-bottom: 20px !important;
             padding-right: 20px !important;
          }

          .concept p:last-child {
             margin-bottom: 0px !important;
          }

    /* GROUPES */

          .groupes {
             height: 60px; max-height: 60px;
             text-align: center;
          }

          .groupes li {
             display: inline-block;
             margin: 0 10px;
          }

    /* NEWS */

          .news {
             height: 87px; max-height: 87px;
             overflow-y: scroll;
          }

          .news strong {
             color: #d74e77;
             font-family: sans-serif;
             text-transform: uppercase;
             font-weight: normal;
          }

          .news p {
             border-bottom: 1px solid lightgray;
             padding: 2px 0 !important; margin: 2px 0 !important;
          }

          .news p:hover {
             border-bottom: 1px solid lightgray;
             padding: 2px 0 2px 20px !important; margin: 2px 0 !important;
          }

    /* CONCOURS */
          
          ul#concours {
             width: 280px;
             height: 114px; max-height: 114px;
             margin: 0px auto 0;
             text-align: center;
          }
          
          ul#concours li {
             width: 84px;
             margin: 0 5px;
             display: inline-block;
             position: relative;
             z-index: 4;
          }

          ul#concours li span {
             display: none;
             width: 150px;
             padding: 10px;
             position: absolute;
             bottom: 60px;   right: 50%; margin-right: -75px;
             background: #fff;
             color: #fff;
             z-index: 5;
             border-radius: 10px;
             border-bottom: 1px solid #d74e77;
          }

          ul#concours li:hover span {
             display: block;
          }

          ul#concours li span img {
             max-width: 150px;
             height: auto;
          }

          .fleche {
             width: 26px;
             height: 12px;
             background: url("http://i39.servimg.com/u/f39/19/07/10/81/fleche11.png");
             position: absolute;
             bottom: -12px;
             left: 50%;
             margin-left: -13px;
          }

    /* STAFF */

          #staff img, ul#concours li img.mini {
             -webkit-mask: url(http://henrynicolas.be/fow/pa-madiix/mask.svg) top left / cover;
             -moz-mask: url(http://henrynicolas.be/fow/pa-madiix/mask.svg) top left / cover;
             -ms-mask: url(http://henrynicolas.be/fow/pa-madiix/mask.svg) top left / cover;
             -o-mask: url(http://henrynicolas.be/fow/pa-madiix/mask.svg) top left / cover;
             mask: url(http://henrynicolas.be/fow/pa-madiix/mask.svg) top left / cover;
          }

          #staff li {
             display: inline-block;
             width: 80px; max-width: 80px;
          }

          #staff li:hover {
             cursor: help;
          }

          .staff p {
             padding: 10px 0 10px !important;
          }

          .staff{
             text-align: center;
          }

          .staff .pseudo
          {
             display: inline-block;
             color: #d74e77;
          }

    /* PARTENAIRES */
          
          td.partenaires {
             padding-top: 15px !important;
          }

          .tickercontainer { /* the outer div with the black border */
             width: 750px;
             height: 31px;
             margin: 0 auto;
             padding: 0;
             overflow: hidden;
             position: relative;
             z-index: 2;
          }
          .tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
             position: relative;
             left: 0px;
             top: 0px;
             width: 750px;
             overflow: hidden;
          }
          ul.newsticker { /* that's your list */
             position: relative;
             left: 750px;
          }
          ul.newsticker li {
             float: left; /* important: display inline gives incorrect results when you check for elem's width */
             width: 88px;
             margin: 0 2px;
             padding: 0;
          }

    /* CREDITS */

          #credits {
             position: absolute;
             padding: 0px 10px;
             bottom: -20px;
             right: 0px;
             height: 20px;
             line-height: 20px;
             font-size: 8px;
             color: gray;
             text-transform: uppercase;
             text-shadow: 1px 1px 0px #ffffff;
          }
          
    /* SCROLLBAR */

          ::-webkit-scrollbar{height:12px;width:5px;background:none;margin-right:5px;}
          ::-webkit-scrollbar-thumb{background:rgba(242,163,189,1);height:30px;border-radius:12px;box-shadow:0px 0px 0px rgba(0, 0, 0, 0.75);cursor:crosshair;}
          ::-webkit-scrollbar-corner{background:none;}

          ::-moz-scrollbar{height:12px;width:5px;background:none;margin-right:5px;}
          ::-moz-scrollbar-thumb{background:rgba(242,163,189,1);height:30px;border-radius:12px;box-shadow:0px 0px 0px rgba(0, 0, 0, 0.75);cursor:crosshair;}
          ::-moz-scrollbar-corner{background:none;}

          ::-ms-scrollbar{height:12px;width:5px;background:none;margin-right:5px;}
          ::-ms-scrollbar-thumb{background:rgba(242,163,189,1);height:30px;border-radius:12px;box-shadow:0px 0px 0px rgba(0, 0, 0, 0.75);cursor:crosshair;}
          ::-ms-scrollbar-corner{background:none;}

          ::-o-scrollbar{height:12px;width:5px;background:none;margin-right:5px;}
          ::-o-scrollbar-thumb{background:rgba(242,163,189,1);height:30px;border-radius:12px;box-shadow:0px 0px 0px rgba(0, 0, 0, 0.75);cursor:crosshair;}
          ::-o-scrollbar-corner{background:none;}

          ::-scrollbar{height:12px;width:5px;background:none;margin-right:5px;}
          ::-scrollbar-thumb{background:rgba(242,163,189,1);height:30px;border-radius:12px;box-shadow:0px 0px 0px rgba(0, 0, 0, 0.75);cursor:crosshair;}
          ::-scrollbar-corner{background:none;}
       </style>
    </head>
    <body>
       <div id="pa">
          <h1>Bienvenue !</h1>
          <table width="800px" cellspacing="15px" cellpadding="10px" id="contenu-general">
             <tr>
                <td rowspan="2" valign="top" class="withbg" width="300px">
                   <h2>Le concept</h2>
                   <div class="concept">
                      <p>Bien le bonjour</p>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem, itaque, cum veniam vel sed dicta <a href="">quaerat modi</a> ab soluta molestias voluptas ipsam sit omnis. Nemo, natus facilis suscipit sequi ratione. Lorem ipsum dolor sit amet, consectetur adipisicing </p>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus, ab, voluptates, porro totam omnis eos hic mollitia beatae quia dolores corrupti delectus sequi recusandae molestiae sit. Magni saepe repellendus voluptas.</p>
                   </div>
                </td>
                <td valign="top" width="450px">
                   <ul class="groupes">
                      <li><a href="" style="color: red;">groupe 1</a></li>
                      <li><a href="" style="color: green;">groupe 2</a></li>
                      <li><a href="" style="color: orange;">groupe 3</a></li>
                      <li><a href="" style="color: blue;">groupe 4</a></li>
                      <li><a href="" style="color: magenta;">groupe 5</a></li>
                   </ul>
                </td>
             </tr>
             <tr>
                <!-- <td>lol</td> on supprime cette ligne, car rowspan -->
                <td valign="top" class="withbg">
                   <h2>Les nouveautés</h2>
                   <div class="news">
                      <p><strong>News 1 :</strong> <a href="">Les fourmis ont des pattes!</a></p>
                      <p><strong>News 2 :</strong> Quoi, une news sans lien ? </p>
                      <p><strong>News 3 :</strong> <a href="">Pas touche la mouche</a></p>
                      <p><strong>News 4 :</strong> <a href="">T'as pas pris ta douche</a></p>
                      <p><strong>News 5 :</strong> The style for news</p>
                      <p><strong>News 6 :</strong> The style for news</p>
                      <p><strong>News 7 :</strong> The style for news</p>
                      <p><strong>News 8 :</strong> The style for news</p>
                   </div>
                </td>
             </tr>
             <tr>
                <td valign="top" class="withbg">
                   <h2>Concours</h2>
                   <ul id="concours">
                      <li>
                         <img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt="AOTM" class="mini"> <!-- miniature concours 84*37px -->
                         <div class="titre-concours">AOTM</div> <!-- titre concours -->
                         <span>
                            <img src="http://r24.imgfast.net/users/2915/57/91/98/avatars/17369-57.jpg" alt=""> <!-- infobulle -->
                            <div class="fleche"></div> <!-- tite fleche -->
                         </span>
                      </li>
                      <li>
                         <img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt="AOTM" class="mini"> <!-- miniature concours 84*37px -->
                         <div class="titre-concours">AOTM</div> <!-- titre concours -->
                         <span>
                            <img src="http://r24.imgfast.net/users/2915/57/91/98/avatars/17369-57.jpg" alt=""> <!-- infobulle -->
                            <div class="fleche"></div> <!-- tite fleche -->
                         </span>
                      </li>
                      <!--
                         BLOC A DUPLIQUER SI 3 OU 4 CONCOURS :
                      <li>
                         <img src="staff.png" alt="AOTM" class="mini">
                         <div class="titre-concours">AOTM</div>
                         <span>
                            <img src="http://r24.imgfast.net/users/2915/57/91/98/avatars/17369-57.jpg" alt="">
                            <div class="fleche"></div>
                         </span>
                      </li> -->
                   </ul>
                </td>
                <td valign="top" class="withbg">
                   <h2>Le staff</h2>
                      <ul id="staff">
                         <li onMouseOver="javascript:staff1()"><img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt=""></li>
                         <li onMouseOver="javascript:staff2()"><img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt=""></li>
                         <li onMouseOver="javascript:staff3()"><img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt=""></li>
                         <li onMouseOver="javascript:staff4()"><img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt=""></li>
                         <li onMouseOver="javascript:staff5()"><img src="http://i39.servimg.com/u/f39/19/07/10/81/staff11.png" alt=""></li>
                      </ul>
                   <div class="staff">
                      <div id="staff1">
                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt, sapiente, quos, qui corporis soluta optio aspernatur harum minus asperiores ipsum repudiandae placeat ipsam.</p>
                         <div class="pseudo">PSEUDO</div> • <a href="">PROFIL</a> • <a href="">MP</a>
                      </div>

                      <div id="staff2" style="display:none;">
                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, aliquid, laudantium, neque eius nemo amet dolores velit esse voluptas dicta quisquam quos consequuntur provident</p>
                         <div class="pseudo">PSEUDO</div> • <a href="">PROFIL</a> • <a href="">MP</a>
                      </div>

                      <div id="staff3" style="display:none;">
                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam, illo, assumenda, pariatur reprehenderit nam vero tempore nostrum laboriosam molestiae maxime incidunt.</p>
                         <div class="pseudo">PSEUDO</div> • <a href="">PROFIL</a> • <a href="">MP</a>
                      </div>

                      <div id="staff4" style="display:none;">
                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi, autem, dolor in quaerat quas quos pariatur iusto aliquid laudantium et ipsum nulla dignissimos.</p>
                         <div class="pseudo">PSEUDO</div> • <a href="">PROFIL</a> • <a href="">MP</a>
                      </div>

                      <div id="staff5" style="display:none;">
                         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, voluptate rerum ipsam incidunt magni temporibus voluptatibus voluptas labore praesentium nemo deserunt.</p>
                         <div class="pseudo">PSEUDO</div> • <a href="">PROFIL</a> • <a href="">MP</a>
                      </div>
                   </div>
                </td>
             </tr>
             <tr>
                <td valign="top" colspan="2" class="withbg partenaires">
                   <h2>Partenaires</h2>
                   <ul id="ticker01">
                       <li><a href=""><img src="http://i39.servimg.com/u/f39/19/07/10/81/parten11.png" alt=""></a></li>
                       <li><a href=""><img src="http://i39.servimg.com/u/f39/19/07/10/81/parten11.png" alt=""></a></li>
                       <li><a href=""><img src="http://i39.servimg.com/u/f39/19/07/10/81/parten11.png" alt=""></a></li>
                       <!-- eccetera -->
                   </ul>
                </td>
             </tr>
          </table>
       <div id="credits">
          PA réalisée par Henrykiki sur <a href="http://www.never-utopia.com/t52871-henrykiki-pa-grise-rose-pale" target="_blank">Never-Utopia</a>
       </div>
       </div>

       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
       <script type="text/javascript">
          /*!
     * liScroll 1.0
     * Examples and documentation at:
     * http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html
     * 2007-2010 Gian Carlo Mingati
     * Version: 1.0.2.1 (22-APRIL-2011)
     * Dual licensed under the MIT and GPL licenses:
     * http://www.opensource.org/licenses/mit-license.php
     * http://www.gnu.org/licenses/gpl.html
     * Requires:
     * jQuery v1.2.x or later
     *
     */

    jQuery.fn.liScroll = function(settings) {
          settings = jQuery.extend({
          travelocity: 0.07
          }, settings);      
          return this.each(function(){
                var $strip = jQuery(this);
                $strip.addClass("newsticker")
                var stripWidth = 1;
                $strip.find("li").each(function(i){
                stripWidth += jQuery(this, i).outerWidth(true); // thanks to Michael Haszprunar and Fabien Volpi
                });
                var $mask = $strip.wrap("<div class='mask'></div>");
                var $tickercontainer = $strip.parent().wrap("<div class='tickercontainer'></div>");                        
                var containerWidth = $strip.parent().parent().width();   //a.k.a. 'mask' width    
                $strip.width(stripWidth);         
                var totalTravel = stripWidth+containerWidth;
                var defTiming = totalTravel/settings.travelocity;   // thanks to Scott Waye      
                function scrollnews(spazio, tempo){
                $strip.animate({left: '-='+ spazio}, tempo, "linear", function(){$strip.css("left", containerWidth); scrollnews(totalTravel, defTiming);});
                }
                scrollnews(totalTravel, defTiming);            
                $strip.hover(function(){
                jQuery(this).stop();
                },
                function(){
                var offset = jQuery(this).offset();
                var residualSpace = offset.left + stripWidth;
                var residualTime = residualSpace/settings.travelocity;
                scrollnews(residualSpace, residualTime);
                });         
          });   
    };
       </script>
       <script>
          $(function(){
           $("#ticker01").liScroll();
       });

       function staff1() {
             document.getElementById('staff1').style.display='block';
             document.getElementById('staff2').style.display='none';
             document.getElementById('staff3').style.display='none';
             document.getElementById('staff4').style.display='none';
             document.getElementById('staff5').style.display='none';}
          function staff2() {
             document.getElementById('staff1').style.display='none';
             document.getElementById('staff2').style.display='block';
             document.getElementById('staff3').style.display='none';
             document.getElementById('staff4').style.display='none';
             document.getElementById('staff5').style.display='none';}
          function staff3() {
             document.getElementById('staff1').style.display='none';
             document.getElementById('staff2').style.display='none';
             document.getElementById('staff3').style.display='block';
             document.getElementById('staff4').style.display='none';
             document.getElementById('staff5').style.display='none';}
          function staff4() {
             document.getElementById('staff1').style.display='none';
             document.getElementById('staff2').style.display='none';
             document.getElementById('staff3').style.display='none';
             document.getElementById('staff4').style.display='block';
             document.getElementById('staff5').style.display='none';}
          function staff5() {
             document.getElementById('staff1').style.display='none';
             document.getElementById('staff2').style.display='none';
             document.getElementById('staff3').style.display='none';
             document.getElementById('staff4').style.display='none';
             document.getElementById('staff5').style.display='block';}
       </script>
    </body>
    </html>

    Insertion sur la page d'accueil :


    Une fois que tu as enregistré ta page web (copie/colle l'adresse internet de celle-ci quelque part, car tu vas en avoir besoin), il te suffit de te rendre sur ta page d'accueil, et de coller le code pour insérer une iframe, à savoir :

    Code:
    <iframe style="width: 850px; height: 650px;" scrolling="no" frameborder="0" src="HTTP://ADRESSE-DE-TA-PAGE-HTML-RECEMMENT-CREE"></iframe>

    Et tu auras ainsi ta belle Page d'accueil toute fonctionnelle :)

    Attention: cette PA fonctionne avec du Javascript. Il est donc obligatoire de passer via une page html & un iframe!


    Merci de ne pas toucher aux crédits envers Never-Utopia.


    Une question ?


    Je serai ravi de vous y répondre là-bas : problème avec votre code.


    Dernière édition par Henrykiki le Sam 27 Déc 2014 - 22:49, édité 3 fois
    alex24d
    alex24d
    FémininAge : 32Messages : 95

    le Ven 31 Juil 2015 - 15:59

    j'adore
    mon-etoile
    mon-etoile
    FémininAge : 32Messages : 140

    le Lun 3 Aoû 2015 - 14:58

    Merci pour ce jolie thème je vais voir si je saurais faire mais nous cherchions un thème similaire en rose vraiment bravo !
    Kelalin
    Kelalin
    FémininAge : 28Messages : 2416

    le Lun 3 Aoû 2015 - 19:06

    Le rendu final est superbe ! Merci pour ce code (^_^)
    mon-etoile
    mon-etoile
    FémininAge : 32Messages : 140

    le Lun 3 Aoû 2015 - 20:02

    Je dois vraiment être une patate en codage car je n'y suis pas arriver ...
    EAVENN
    EAVENN
    FémininAge : 24Messages : 162

    le Lun 3 Aoû 2015 - 20:04

    merci
    Istina
    Istina
    FémininAge : 26Messages : 111

    le Lun 3 Aoû 2015 - 20:20

    Merciiii ♥
    Dahlia
    Dahlia
    FémininAge : 23Messages : 33

    le Mer 5 Aoû 2015 - 1:55

    merci, c'est magnifique ♥
    avatar
    GEnterZ
    MasculinAge : 22Messages : 63

    le Sam 8 Aoû 2015 - 11:58

    Merci. :)
    NanoiHime
    NanoiHime
    FémininAge : 22Messages : 566

    le Jeu 13 Aoû 2015 - 13:28

    Merci :hug:



    Bluvery
    Bluvery
    FémininAge : 20Messages : 20

    le Jeu 13 Aoû 2015 - 22:28

    Merciii
    Kripterya
    Kripterya
    FémininAge : 34Messages : 98

    le Ven 14 Aoû 2015 - 21:49

    merci
    darkazu
    darkazu
    FémininAge : 26Messages : 42

    le Sam 15 Aoû 2015 - 16:57

    merci ! je rechercher un truc spécial et beau ! je l'ai trouvé!
    Anonymous
    Invité

    le Mar 18 Aoû 2015 - 0:27

    :heart:
    L0une
    L0une
    FémininAge : 29Messages : 802

    le Mar 18 Aoû 2015 - 20:34

    Merci ! =)




    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 854973Sanstitre12

    Les cadeaux !:
    Merci Kathee-Lamette !
    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 1437236719-loune


    Les Aëro !:
    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Aero10

    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 514572signaAero

    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 883774aero2


    Sakura-chan
    Sakura-chan
    FémininAge : 23Messages : 180

    le Mer 19 Aoû 2015 - 15:49

    Super joli en tout cas, merci du partage ! ^^
    Noubil
    Noubil
    FémininAge : 32Messages : 59

    le Mer 19 Aoû 2015 - 23:37

    Magnifique *-*
    Reystern
    Reystern
    FémininAge : 17Messages : 89

    le Jeu 20 Aoû 2015 - 22:14

    Vraiment super jolie, merci beaucoup !
    Milou
    Milou
    FémininAge : 21Messages : 163

    le Sam 22 Aoû 2015 - 13:27

    oWo C'est beau ! Merci ^^



    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 693002signa
    [LT]BountyS4
    [LT]BountyS4
    MasculinAge : 24Messages : 57

    le Dim 23 Aoû 2015 - 10:34

    merci beaucoup ^^



    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 478991DavyJonessign
    Invy
    Invy
    FémininAge : 27Messages : 48

    le Dim 23 Aoû 2015 - 18:54

    Il est magnifique! Un grand merci.
    Nao'
    Nao'
    FémininAge : 29Messages : 31

    le Lun 24 Aoû 2015 - 15:01

    Merci~



    PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Tumblrloo23qdg321qhh19q PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Tumblrloo25b5e5v1qhh19q PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Tumblrloo24vnqzm1qhh19q PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Tumblrloo23kzrit1qhh19q PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Tumblrloo2471rxv1qhh19q PA gris/rose + infobulles + staff + news + partenaires défilants. - Page 15 Cupcake
    Crazy-Sweet
    Crazy-Sweet
    FémininAge : 29Messages : 131

    le Lun 24 Aoû 2015 - 17:29

    Merci !




    Our ice hearts beat
    Voir le monde dans un grain de sable. Et le paradis dans une fleur sauvage. Tenir l'infini dans le creux de sa main. Et l'éternité dans une heure - SIR WILLIAM BLAKE

    Trisse
    Trisse
    FémininAge : 20Messages : 36

    le Mar 25 Aoû 2015 - 19:38

    Merci !
    Sentenza
    Sentenza
    MasculinAge : 36Messages : 95

    le Mer 26 Aoû 2015 - 20:30

    merci
    Shanyme Thibolt
    Shanyme Thibolt
    FémininAge : 26Messages : 152

    le Mer 26 Aoû 2015 - 20:52

    Merci pour le partage
    Contenu sponsorisé


      La date/heure actuelle est Sam 28 Nov 2020 - 2:23