AccueilDernières imagesRechercherS'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.

Le Deal du moment : -43%
-100€ Pack rééquipement Philips Hue ...
Voir le deal
129.99 €

    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante !

    Sondage

    Pacman ou Pacman ?

    [ 5 ]
    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! Empty38%[Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! Empty [38%] 
    [ 8 ]
    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! Empty62%[Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! Empty [62%] 

    Total des votes: 13
    Sondage clos
    Fyraliel
    Fyraliel
    FémininAge : 33Messages : 1424

    Mer 16 Déc 2015 - 15:22

    Coucou tout le monde, voici enfin les votes pour ce défi ^^

    Louchita

    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! 151216032643677930

    Code:
    <!DOCTYPE html><html>

    <meta content="text/html"; charset="ISO-8859-15" http-equiv="Content-Type" /> <script type="text/javascript">
    </script> <style type="text/css">

    .fond {
    width: 560px;
    height: auto;
    background: #000000;
    border: 5px dotted #f3f317;
    padding: 10px;
    margin-top: 20px;
    }

    .man {
    float: right;
    width: 40px;
    height: 40px;
    background: url('http://image.noelshack.com/fichiers/2015/42/1444856204-pacman.gif');
    margin-right: 10px;
    margin-top: -34px;
    }

    .avatar {
    display: inline-block;
    z-index: 50;
    width: 200px;
    height: 200px;
    background: url('http://image.noelshack.com/fichiers/2015/42/1444860033-imgpacman.png');
    margin: 15px;
    }

    .avatar2{
    z-index: 99;
    width: 200px;
    height: 200px;
    background: url('http://image.noelshack.com/fichiers/2015/42/1444861770-fimgpacman.png');
    opacity: 1;
    transition: 0.6s;
    }

    .avatar2:hover {
    opacity: 0;
    transition: 0.6s;
    }

    .g_titre {
    width: 530px;
    color: #ffff00;
    margin:auto;
    margin-bottom: 15px;
    font-family: VT323 ;
    font-size: 32px;
    font-style: bold;
    text-transform: uppercase;
    text-align: center;
    }

    .p_titre {
    width: 530px;
    height: 36px;
    background: url('http://image.noelshack.com/fichiers/2015/42/1444857051-ghost.gif');
    margin: auto;
    margin-top: 10px;
    }

    .bloc1 {
    display: inline-block;
    width: 50%;
    height: 200px;
    border: 2px solid #2121de;
    padding: 5px;
    color: #ffff00;
    margin: 15px;
    overflow: auto;
    text-align: justify;
    font-family: arial;
    font-size: 12px;
    }

    .bloc2 {
    width: 520px;
    max-height: 250px;
    border: 2px solid #2121de;
    padding: 5px;
    color: #ffff00;
    margin: auto;
    overflow: auto;
    text-align: justify;
    font-family: arial;
    font-size: 12px;
    }

      ::-webkit-scrollbar {
               width: 8px;
               background-color: black;
               height: 6px;}
      
                 ::-webkit-scrollbar-track {
               background-color: black; }  
      
               ::-webkit-scrollbar-thumb {
               background-color: #ffff00; }

    .copyright {
    font-family: arial;
    font-size: 8px;
    color: #dedede;
    text-align: center;
    text-transform: uppercase;
    margin:10px;
    transition: 0.6s;
    }

    .copyright:hover {
    letter-spacing: 10px;
    transition: 0.6s;
    }

    </style>
    <link href='https://fonts.googleapis.com/css?family=VT323' rel='stylesheet' type='text/css'>
    <div class="fond">
      <div class="man"></div>
      <div class="g_titre">
        Pacman est là !
      </div>  
       <div class="avatar">
        <div class="avatar2">
      </div>
      </div>
      <div class="bloc1">
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
        <b> Question :</b> <i> Réponse </i><br/>
      </div>
      <div class="p_titre">
      </div>
      <div class="bloc2">
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
      </div>
      <div class="p_titre">
      </div>
      <div class="bloc2">
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
        Etenim si attendere diligenter, existimare vere de omni hac causa volueritis, sic constituetis, iudices, nec descensurum quemquam
        ad hanc accusationem fuisse, cui, utrum vellet, liceret, nec, cum descendisset, quicquam habiturum spei fuisse, nisi alicuius
        intolerabili libidine et nimis acerbo odio niteretur. Sed ego Atratino, humanissimo atque optimo adulescenti meo necessario,
        ignosco, qui habet excusationem vel pietatis vel necessitatis vel aetatis. Si voluit accusare, pietati tribuo, si iussus est,
        necessitati, si speravit aliquid, pueritiae. Ceteris non modo nihil ignoscendum, sed etiam acriter est resistendum.
      </div>
      <div class="copyright">Codage par Louchita</div>
    </div>

    </html>

    Fyraliel

    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! 151215081942524588

    Code:
    <style>
      .cadre_total {
        height: 120px;
        width: 600px;
        border: 3px solid #002ADB;
        border-radius: 5px;
        background: #000;
      }
      
      .cadre_interne {
        position: relative;
        height: 105px;
        width: 585px;
        border: 2px solid #02209C;
        border-radius: 5px;
        margin: 5px;
        overflow: hidden;
      }
      
      .background {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        border-radius: 5px;
        line-height: 105px;
        text-align: right;
        overflow: hidden;
      }
      
      .background > img {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        z-index: 2;
      }
      
      .cadre_interne:hover .background > img {
        opacity: 1;
        transition: 3s all linear 5s;
      }
      
      .pacman {
        background: #000;
        height: 105px;
        width: 595px;
        position: absolute;
        left: -575px;
      }
      
      .pacman img {
        position: absolute;
        height: 75px;
        width: 75px;
        right: -65px;
        top: 15px;
      }
      
      .cadre_interne:hover .pacman {
        left: 0;
        transition: 5s all linear;
      }
      
      .pacman img:last-of-type,
      .cadre_interne:hover .pacman img:first-of-type {
        opacity: 0;
      }
      
      .cadre_interne:hover .pacman img:last-of-type {
        opacity: 1;
      }
      
      .point,
      .point2 {
        border-radius: 10px;
        background: #fff;
        display: inline-block;
        margin-right: 20px;
        vertical-align: middle;
      }
      
      .point {
        height: 8px;
        width: 8px;
      }
      
      .point2 {
        height: 15px;
        width: 15px;
      }

    </style>
    <div class="cadre_total">
      <div class="cadre_interne">
        <div class="background">
          <img src="http://nsa37.casimages.com/img/2015/09/21/150921091707267740.png" />
          <div class="pacman">
            <img src="http://nsa38.casimages.com/img/2015/09/20/150920074159597319.png" />
            <img src="http://nsa38.casimages.com/img/2015/09/20/150920072853927723.gif" />
          </div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point"></div>
          <div class="point2"></div>
        </div>
      </div>
    </div>

    A vos votes Wink



    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! F86e7518c1
    • Revenir en haut
    L0une
    L0une
    FémininAge : 33Messages : 802

    Ven 18 Déc 2015 - 8:42

    Dure comme décision ! Les deux sont vraiment sympas je trouve et je serais bien incapable de faire un truc pareil donc déjà un grand bravo !

    Je vais voter pour la première, je trouve que faire une petite fiche comme ça est une bonne idée malgré les couleurs pétantes (Pacman en même temps donc bon).

    GG en tout cas à toutes les deux ! =)




    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! 854973Sanstitre12

    Les cadeaux !:


    Les Aëro !:


    • Revenir en haut
    Shoki
    Shoki
    FémininAge : 23Messages : 1308

    Ven 18 Déc 2015 - 12:51

    Bon ça fait un pitit moment que j'ai voté mais bon x')
    J'ai un gros faible pour la seconde, parce que omg elle est trop bien faite, les effets et tout aaaaaah *sors*

    Bref, bravo à vous deux /o/




    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! 5qox
    • Revenir en haut
    Nihil Scar Winspeare
    Nihil Scar Winspeare
    Messages : 5244

    Sam 19 Déc 2015 - 18:38

    On a combien de temps pour voté ? Je ne sais pas encore sur laquelle mon choix va s'arrêter étant donné que j'aime bien les 2 ><... encore un choix difficile !

    Je ne sais pas si c'est déjà signalé, mais sinon, le topic de vote est pas sur la PA o:

    • Revenir en haut
    Fyraliel
    Fyraliel
    FémininAge : 33Messages : 1424

    Sam 19 Déc 2015 - 20:11

    j'ai mis 10 jours je crois ^^'
    et sinon oui c'est signalé ^^



    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! F86e7518c1
    • Revenir en haut
    Klebs
    Klebs
    FémininAge : 23Messages : 646

    Jeu 24 Déc 2015 - 11:24

    Personnellement je vote pour le deuxième :)
    Je le trouve plus attractif et plus rigolo, même si le premier est chouette aussi !



    [Vote] Y'a de l'ambiance #4 - Le Retrogaming - Fyraliel gagnante ! 707599klebs2
    Merci à NanoiHime pour ce cadeau Wink
    • Revenir en haut
    Neva
    Neva
    FémininAge : 33Messages : 18565

    Dim 17 Jan 2016 - 10:09

    Si je ne me trompe pas, c'est Fyra qui a gagné ce défi !
    C'était deux participations bien cool, félicitations à vous deux. Hésitez pas à poster vos réalisations en LS si ce n'est pas déjà fait :)



     
    • Revenir en haut
    Contenu sponsorisé

    • Revenir en haut
    « Voir le sujet précédent · Voir le sujet suivant »
      La date/heure actuelle est Jeu 21 Nov 2024 - 11:41