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 : 9751

    le Sam 19 Juil 2014 - 14:12

    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 >
    Etoile*
    FémininAge : 26Messages : 73

    le Ven 25 Juil 2014 - 12:02

    C'est vraiment joli, merci du partage :)
    avatar
    Layla4
    FémininAge : 18Messages : 149

    le Mar 29 Juil 2014 - 23:16

    Merci beaucoup :3
    avatar
    Tatia38
    FémininAge : 29Messages : 306

    le Mer 30 Juil 2014 - 8:54

    C'est vraiment joli merci beaucoup
    avatar
    Doan Lavita
    FémininAge : 20Messages : 72

    le Mer 30 Juil 2014 - 12:51

    Merci! *^*



    avatar
    Kiwii
    FémininAge : 20Messages : 57

    le Mer 30 Juil 2014 - 13:50

    C'est très beau comme toujours ! *o*
    Merci du partage !
    avatar
    Demoniall
    FémininAge : 17Messages : 74

    le Mer 30 Juil 2014 - 15:28

    MAgnifique, comme toujours , merci !
    avatar
    Féhéla
    FémininAge : 44Messages : 238

    le Ven 1 Aoû 2014 - 20:57

    merci du partage
    avatar
    Tchii
    FémininAge : 32Messages : 251

    le Sam 2 Aoû 2014 - 16:40

    Coucou!
    Merci pour ce QEEL!
    A trés vite.
    Tchii!
    avatar
    Emelyne
    FémininAge : 36Messages : 77

    le Sam 2 Aoû 2014 - 18:34

    c'est superbe *.*
    merci
    avatar
    Hancok
    FémininAge : 33Messages : 1039

    le Dim 3 Aoû 2014 - 9:12

    Oh jolie c'est exactement ce style que je cherchai pour mon forum :)





    avatar
    skaera22
    MasculinAge : 23Messages : 72

    le Dim 3 Aoû 2014 - 15:49

    thx
    avatar
    Joshua023
    MasculinAge : 28Messages : 98

    le Lun 4 Aoû 2014 - 16:22

    Ça a l'air sympa, merci :) !



    avatar
    Velvet-Mist
    FémininAge : 27Messages : 44

    le Lun 4 Aoû 2014 - 18:17

    Sublime! Merci beaucoup!
    avatar
    Choubakawa
    MasculinAge : 24Messages : 81

    le Sam 9 Aoû 2014 - 11:19

    Merci ^^



    avatar
    catkiller
    FémininAge : 23Messages : 70

    le Dim 10 Aoû 2014 - 5:24

    Waouh! Coup de coeur pour ce Qeel magnifique!
    avatar
    Dastan
    MasculinAge : 34Messages : 111

    le Dim 10 Aoû 2014 - 16:25

    Merci !
    avatar
    Kreazen
    FémininAge : 21Messages : 46

    le Lun 11 Aoû 2014 - 0:22

    merci pour le tuto



    Arrow
    avatar
    DixieM.
    FémininAge : 26Messages : 49

    le Lun 11 Aoû 2014 - 13:03

    :hug: Merci du partage
    avatar
    Lovehurt
    FémininAge : 21Messages : 36

    le Lun 11 Aoû 2014 - 15:08

    C'est jolie :3
    Merci <3
    avatar
    Cruelly
    FémininAge : 25Messages : 2563

    le Mar 12 Aoû 2014 - 2:40

    Magnifique merci :)



    MON PROJET :heart: j'ai besoin d'avis ^^


    avatar
    Afterglow.winter
    FémininAge : 22Messages : 138

    le Mer 13 Aoû 2014 - 0:44

    Superbe  :friends: 



    How do you get up from an all time low?
    avatar
    Jawilsia
    FémininAge : 26Messages : 143

    le Sam 16 Aoû 2014 - 21:21

    Merci !  Very Happy 
    avatar
    Aile
    FémininAge : 30Messages : 134

    le Dim 17 Aoû 2014 - 16:34

    Aussi magnifique que le codage de la PA. Merci beaucoup. Tu fais un travail formidable!



    avatar
    Chione
    MasculinAge : 17Messages : 397

    le Mar 19 Aoû 2014 - 15:22

    Merci!




    FEZ!FEZ!
    Contenu sponsorisé


      La date/heure actuelle est Dim 27 Mai 2018 - 15:36