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.


    QEEL Littéraire (positionnement manuel)

    Partagez
    avatar
    Halloween
    FémininAge : 24Messages : 9752

    le Sam 19 Juil 2014 - 14:12

    Rappel du premier message :

    Plop,

    Un nouveau LS basé sur une demande de Percylove.

    Comme toujours, un merci donne accès aux codes, ça fait toujours plaisir et ça prend pas 20 minutes de vos vies =3

    /!\ Je rappelle que cette section existe en cas de problème, je ne réponds pas aux MP (et encore moins quand ils sont rageux !).



    Qui est en ligne ?


    HTML & CSS ▬ Les éléments sont dans des divisions placées manuellement ▬ La PA est ici.
    Aperçu ▬ www



    CSS
    Code:
        /* -------------------------------- QEEL -------------------------------- */

        /* Positionnement du bloc des statistiques */
        .stats_qeel {
          position: absolute;
          top: 13em;
          left: 3em;
          width: 180px;
          height: 180px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Positionnement du bloc des plumes passagères */
        .plumes_passagères {
          position: absolute;
          top: 8.5em;
          left: 30em;
          width: 280px;
          height: 50px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Transparence des anniversaires et des dernières 24h */
        #kaboum .row1 {
          background-color : transparent;
        }

        /* Positionnement du bloc des plumes fêtées */
        .plumes_fetees {
          position: absolute;
          top: 8em;
          left: 56em;
          width: 170px;
          height: 80px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Positionnement du bloc des crédits */
        .crédits_qeel {
          position: absolute;
          top: 37em;
          left: 4em;
          width: 230px;
          height: 35px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Mise en forme des liens des crédits */
        .crédits_qeel a {
          color: #20040D !important;
          font-size: 11px !important;
          text-transform: uppercase !important;
          letter-spacing: 1px;
          text-decoration: none !important;
        }

        /* Mise en forme des liens des crédits au survol */
        .crédits_qeel a:hover {
          color: #856570 !important;
          text-decoration: none !important;
        }

        /* Positionnement du bloc des plumes présentes */
        .plumes_presentes {
          position: absolute;
          top: 20em;
          left: 27em;
          width: 270px;
          height: 143px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
          transform: rotate(-5deg);
        }

        /* Mise en forme des liens des plumes présentes */
        .plumes_presentes a {
          text-decoration: none !important;
        }

        /* Positionnement du bloc des groupes */
        .groupes_qeel {
          position: absolute;
          top: 25em;
          left: 59.5em;
          width: 100px;
          font-family: times new roman;
          font-size: 11px;
          text-align: center;
        }

        /* Mise en forme des liens des groupes */
        .groupes_qeel a{
          text-transform: uppercase !important;
          letter-spacing: 3px;
          text-decoration: none !important;
        }

        /* -------------------------------- FIN QEEL -------------------------------- */


    Dans le template index_body, remplacer ceci :
    Code:
        <!-- BEGIN disable_viewonline -->
        <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
          <tr>
              <td class="catHead" colspan="2" height="28">
              <!-- BEGIN switch_viewonline_link -->
              <span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
              <!-- END switch_viewonline_link -->

              <!-- BEGIN switch_viewonline_nolink -->
              <span class="cattitle">{L_WHO_IS_ONLINE}</span>
              <!-- END switch_viewonline_nolink -->
              </td>
          </tr>
          <tr>
              <td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
              <td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
              {TOTAL_USERS}<br />
              {NEWEST_USER}</span></td>
          </tr>
          <tr>
              <td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
              {RECORD_USERS}<br />
              <br />
              {LOGGED_IN_USER_LIST}</span></td>
          </tr>
          {L_CONNECTED_MEMBERS}
          {L_WHOSBIRTHDAY_TODAY}
          {L_WHOSBIRTHDAY_WEEK}
          <tr>
              <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
          </tr>
          <!-- BEGIN switch_chatbox_activate -->
          <tr>
              <td class="row1">
                <span class="gensmall">{TOTAL_CHATTERS_ONLINE} :&nbsp; {CHATTERS_LIST}<br />
                    <!-- BEGIN switch_chatbox_popup -->
                    <div id="chatbox_popup"></div>
                    <script type="text/javascript">
                    //<![CDATA[
                    insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
                    //]]>
                    </script>
                    <!-- END switch_chatbox_popup -->
                </span>
              </td>
          </tr>
          <!-- END switch_chatbox_activate -->
        </table>
        <!-- END disable_viewonline -->

    Par cela :
    Code:
        <!-- BEGIN disable_viewonline --><div style="position: relative; background-image: url('http://nsa34.casimages.com/img/2014/07/15/140715095157647502.png'); width: 810px; height: 460px;">
        <div class="stats_qeel">{TOTAL_POSTS}. {TOTAL_USERS}. {NEWEST_USER}. <br /><br />
        {TOTAL_USERS_ONLINE}</div>

        <div class="plumes_passagères"><table id="kaboum">{L_CONNECTED_MEMBERS}</table></div>
        <div class="plumes_fetees"><table id="kaboum">{L_WHOSBIRTHDAY_TODAY}
          {L_WHOSBIRTHDAY_WEEK}</table></div>

        <div class="crédits_qeel">PA et QEEL par Halloween sur <a href="http://www.never-utopia.com">Never Utopia</a>. Forte inter in huic artes alia facultas quis neque ad artes huic quaedam commune quidem cognatione facultas cognatione a se facultas quadam aut quae cognatione fuimus cognatione habent penitus ad penitus quae artes commune in dicendi quis uni ratio dicendi hoc hoc quasi nos quadam ratio ratio quaedam ingeni ne quod dediti dicendi dediti ingeni sit hoc quaedam ita commune se omnes studio Etenim huic habent quis studio ingeni disciplina quadam penitus uni commune nobis nos quaedam nos artes studio quadam et miretur ingeni nos quidem dediti ad quae quae penitus artes ratio dici neque quadam quadam dicendi nos hoc.</div>

        <div class="plumes_presentes">{LOGGED_IN_USER_LIST}</div>

        <div class="groupes_qeel"><a href="http://plume-artistique.forumactif.org/f26-plume-de-rossignol" style="color: #D80543!important;">Rossignol</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f21-plume-de-becasseau" style="color: #8A6D4B!important;">Bécasseau</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f22-plume-d-oie" style="color: #EA792A!important;">Oie</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f23-plume-d-hirondelle" style="color: #8373AB!important;">Hirondelle</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f24-plume-de-chevalier" style="color: #5B181A!important;">Chevalier</a><br /><br />
          <a href="http://plume-artistique.forumactif.org/f25-plume-d-hibou" style="color: #2C0F96!important;">Hibou</a></div></div>
        <!-- END disable_viewonline -->

    Pensez à activer l'affichage des membres connectés ces 24h dernières heures pour qu'il apparaisse (affichage → généralités).






    Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
    Si vous avez des problèmes avec ce LS, venez poster ici.
    Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^




    < / Libre service codage >
    avatar
    Lilith Aube
    FémininAge : 32Messages : 486

    le Sam 29 Nov 2014 - 12:01

    merci =)
    avatar
    Calypso Luciano
    FémininAge : 27Messages : 333

    le Sam 29 Nov 2014 - 14:38

    merci ^^
    avatar
    P'tit loup
    MasculinAge : 35Messages : 437

    le Sam 29 Nov 2014 - 14:53

    très beau, merci pour le partage ^^



    avatar
    G U E R L A I N
    FémininAge : 27Messages : 154

    le Dim 30 Nov 2014 - 18:42

    merci du partage :)



    avatar
    Kirito
    MasculinAge : 22Messages : 200

    le Lun 8 Déc 2014 - 23:04

    Sympa ^-^
    avatar
    leetath
    FémininAge : 37Messages : 29

    le Ven 12 Déc 2014 - 16:22

    très beau travail, merci ^^
    avatar
    Stitch56
    FémininAge : 24Messages : 200

    le Ven 12 Déc 2014 - 23:18

    Wow merci beau rendu que voilà °°
    avatar
    Invité

    le Sam 13 Déc 2014 - 14:16

    Merci il est splendide !
    avatar
    Airore
    FémininAge : 19Messages : 132

    le Ven 26 Déc 2014 - 13:57

    Merci !
    Garunzo
    MasculinAge : 19Messages : 38

    le Sam 27 Déc 2014 - 20:03

    Merci
    avatar
    Nyan-cat
    FémininAge : 19Messages : 326

    le Sam 10 Jan 2015 - 20:54

    Merci ♥ Très poétique



    avatar
    San'ji
    FémininAge : 25Messages : 32

    le Sam 10 Jan 2015 - 21:13

    Superbe *.*



    avatar
    Lilynufare
    FémininAge : 27Messages : 341

    le Dim 11 Jan 2015 - 20:21

    joli, merci
    avatar
    Kiki85
    MasculinAge : 23Messages : 389

    le Dim 25 Jan 2015 - 22:50

    Très jolie Qeel !
    avatar
    Offrande
    FémininAge : 27Messages : 194

    le Mer 28 Jan 2015 - 19:32

    Merci!

    Vraiment très jolie comme Qeel, un travail magnifique!
    avatar
    Fay
    FémininAge : 26Messages : 30

    le Mar 3 Fév 2015 - 15:24

    c'est super ,bravo ^^ merci pour le partage :)



    avatar
    Celuna
    FémininAge : 27Messages : 130

    le Mer 4 Mar 2015 - 10:01

    C'est un très joli Qeel. Merci
    avatar
    Mattyew
    MasculinAge : 24Messages : 88

    le Mer 18 Mar 2015 - 21:27

    Cool ! Merci
    avatar
    Yuki Kaga
    FémininAge : 17Messages : 265

    le Ven 20 Mar 2015 - 23:08

    Merci ♥
    avatar
    damon w salvatore
    FémininAge : 30Messages : 109

    le Dim 22 Mar 2015 - 13:42

    merci beaucoup
    avatar
    MissDream
    FémininAge : 23Messages : 144

    le Dim 22 Mar 2015 - 15:59

    merci beaucoup ^^

    avatar
    Artchie
    FémininAge : 26Messages : 42

    le Mar 24 Mar 2015 - 10:17

    Merci :hug:
    avatar
    WhiteRaaven
    FémininAge : 21Messages : 39

    le Mar 24 Mar 2015 - 10:56

    Merci !
    avatar
    mad love
    FémininAge : 24Messages : 8

    le Dim 19 Avr 2015 - 17:29

    Merci pour le partage **
    avatar
    Nonze
    MasculinAge : 24Messages : 85

    le Mar 28 Avr 2015 - 19:19

    Merci
    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Juin 2018 - 7:04