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.

-10%
Le deal à ne pas rater :
PC Portable Gamer ASUS TUF Gaming F15 | 15,6″ FHD IPS 144 Hz – ...
599.99 € 669.99 €
Voir le deal

    QEEL en 3 colones + Chatbox

    Databar
    Databar
    MasculinAge : 30Messages : 142

    Lun 24 Mar 2014 - 10:02


    Creation: Version 4.1 du forum "RôlePlay Universe"
    Code en libre service distribué que par les membres de RôlePlay Universe avec accord du staff. Ressource en libre service, creditez au nom de RôlePlay Universe et Never Utopia si vous l'utilisez (je vous force pas mais par respect faites le ^^)

    Exemple:
    QEEL en 3 colones + Chatbox 110


    Commencons :) Tout d'abord on va devoir modifier votre template, je vous explique:


    • Trouvez dans "index_body" le code se situant entre les lignes

    :

    Code:
    <!-- BEGIN disable_viewonline --> et <!-- END disable_viewonline -->


    • Puis remplacez-les par ce code:



    Code:
       <script type="text/javascript">
        //<![CDATA[
        $(function(){
           div_marquee('comments_scroll_div', 'comments_scroll_container', '{SCROLL_WAY}', '{SCROLL_STEP}', '{SCROLL_DELAY}', '{SCROLL_HEIGHT}', 'genmed');
        });
        //]]>
        </script>
        <table class="qeeltable" width="100%" border="0" cellspacing="1" cellpadding="0">
          <center> <div class="titreqeel"><a href="http://fr.cooltext.com"><img src="http://images.cooltext.com/3365718.png" width="252" height="31" alt="Qui est en ligne?" /></a></div></center>
          <tr>
          <td><div class="boxqeel">{TOTAL_POSTS}<br/><br/>{TOTAL_USERS}<br/>{NEWEST_USER}<br/><br/>{LOGGED_IN_USER_LIST}</div></td>
            <td><div class="boxqeel">{TOTAL_USERS_ONLINE}<br/><br/>{RECORD_USERS}<br/><br/>{TOTAL_USERS_ONLINE}<br/><br/>{TOTAL_CHATTERS_ONLINE}:  {CHATTERS_LIST}</div></td>
            <td><div class="boxqeel2"><div class="teamadmin">Team Admin</div><br/>
        <div class="teammodo">Team Modo</div><br/>
        <div class="membreslfu">Membre</div><br/>
        <div class="teampartenaire">Partenaire</div><br/>
        <div class="teamvoyageur">Voyageur</div><br/>
        <div class="teampnj">Compte PNJ</div></div></td>
        </tr>
        <tr>
        <td colspan="3"><div class="groupeqeel"><div class="profilmasque" onClick="this.firstChild.value=(this.firstChild.value=='Ouvrir la Chatbox')?'Fermer la Chatbox':'Ouvrir la Chatbox';this.lastChild.style.display=(this.firstChild.value=='Ouvrir la Chatbox')?'none':'block';" style="text-align: center;">
        <input type="button" value="Ouvrir la Chatbox" class="profil1"/>
        <div style="display: none;  text-align:left;"><center><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" id="chatbox_container">
           <tr>
              <td class="row1" valign="top" align="center">
                 <div id="chatbox_portal" style="height:300px;"></div>
                 <script type="text/javascript">
                    insertChatBox('chatbox_portal', '{U_FRAME_CHATBOX}');
                 </script>
              </td>
           </tr>
        </table>

        <table width="100%">
           <tr>
              <td width="100%"> </td>
              <td align="right" width="20">
                 <img src="http://2img.net/i/fa/resize.gif" onmousedown="javascript:resizeElement(event, 'chatbox_portal');" alt="" style="cursor:se-resize;" />
              </td>
           </tr>
        </table></center></div></div></div></td>
        <tr>        <div class="infobulle"><font style="color: #005B89; font-size: 9px;">Voir les Credits
                <span>Ce QEEL a eté codé par Databar pour le forum RôlePlay Universe</span></div></tr>
          </tr>
        </table>

    Ne supprimez pas les deux balise si-dessus, remplacez juste le code qui se situe entre ces ligne



    • Ensuite on passe au code css, la rien de compliqué il vous suffit juste de copier ce code dans votre espace css




    • Code:
        .titreqeel{
          position:center;
          padding-bottom: -7;
          }
          .boxqeel {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          height: 190px;
          font-size:12px;
          /*width: 265px;*/
          margin-top:7px;
          }
          .teamadmin{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          margin-top:: 0px;
          color: #FF0000;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          }

                  .infobulle{position: relative;z-index: 0;}
                  
                 .infobulle:hover{background-color: transparent;z-index: 50;}
                  
                 .infobulle span{
                  position: absolute;
                  background-color: #000000;
                  padding: 5px;
                  left: -1000px;
                  visibility: hidden;
                  color: #FFFFFF;}
                  
                 .infobulle span img{border: 1px;padding: 5px;}
                  
                 .infobulle:hover span{
                  visibility: visible;
                  top: 2px;
                  left: 20px;
                  width: 150px ;
                  color:#FFF;
                  border: 1px solid #fff;
                  -moz-border-radius: 12px;
                  -webkit-border-radius: 12px;
                  border-radius: 12px;}
          .teammodo{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          margin: 0px;
          color: #FF9900;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          }
          .membreslfu{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #82c3ff;
          font-family:: cursive;
          text-postiton: center;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teamadmin:hover{
          color: #FF0000;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teammodo:hover{
           border-radius: 5px;
          color: #FF9900;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          background-color: #095279;
          position: center;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .membreslfu:hover{
           border-radius: 5px;
          color: #82c3ff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          background-color: #095279;
          position: center;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
          transition: 1s;
          -moz-transition: 1s;
          -o-transition: 1s;
          -htm-transition: 1s;
          -webkit-transition: 1s;
          margin: 0px;
          }
          .teampartenaire{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #fffb00;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teampartenaire:hover{
          color: #fffb00;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teamvoyageur{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #c800ff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teamvoyageur:hover{
          color: #c800ff;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teampnj{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #ffffff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teampnj:hover{
          color: #ffffff;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .boxqeel2 {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          height: 190px;
          font-size:12px;
          width: 185px;
          margin-top:7px;
          }
          .groupeqeel {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          width: 895px;
          margin-top:5px;
          }
          .qeeltable {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          box-shadow: 0px 0px 2px #000000;
          /*width: 905px;*/
          }


    Et voila votre QEEL est installé :)
    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 ^^
    Sparrow-style
    Sparrow-style
    FémininAge : 39Messages : 32055

    Lun 5 Mai 2014 - 16:37

    Je valide et déplace, merci ^^



    sign
    avatar
    GEnterZ
    MasculinAge : 25Messages : 63

    Mar 6 Mai 2014 - 21:25

    Merci.
    Anonymous
    Invité

    Mer 7 Mai 2014 - 13:55

    Merci Wink
    lilissa
    lilissa
    FémininAge : 30Messages : 31

    Jeu 8 Mai 2014 - 2:50

    merci ♥
    Choubakawa
    Choubakawa
    MasculinAge : 30Messages : 87

    Lun 12 Mai 2014 - 22:27

    Merci =)



    QEEL en 3 colones + Chatbox Witche13
    Chatchoum
    Chatchoum
    FémininAge : 32Messages : 43

    Lun 19 Mai 2014 - 0:42

    Merci ! je vais voir si ça convient à mes espérances ^^
    Anonymous
    Invité

    Lun 19 Mai 2014 - 8:05

    J'aime beaucoup ton qell Oo
    Heine
    Heine
    MasculinAge : 29Messages : 169

    Jeu 22 Mai 2014 - 15:09

    Merci merci o/



    QEEL en 3 colones + Chatbox 110407104459204818
    arvalis
    arvalis
    FémininAge : 29Messages : 55

    Jeu 22 Mai 2014 - 17:44

    merci =)
    Titou2302
    Titou2302
    MasculinAge : 21Messages : 95

    Mar 3 Juin 2014 - 18:37

    Merci !

    Yuuka
    Yuuka
    FémininAge : 34Messages : 195

    Mer 4 Juin 2014 - 14:02

    Merci beaucoup.
    Eshon
    Eshon
    FémininAge : 43Messages : 197

    Mer 4 Juin 2014 - 15:31

    Très jolie ce codage et j'aime beaucoup le rendu !
    Merci pour le partage ! ^^
    0smose
    0smose
    FémininAge : 28Messages : 167

    Ven 6 Juin 2014 - 20:24

    J'aime énormément ton travail ! Je n'en avais encore jamais vu mais quel joli code ! Merci énormément !



    QEEL en 3 colones + Chatbox Bannie10

    But I'm only human
    And I bleed when I fall down... I'm only human and I crash and I break down. Your words in my head,
    knives in my heart. You build me up and then I fall apart.
    'Cause I'm only human.
    Cruelly
    Cruelly
    FémininAge : 30Messages : 2605

    Ven 6 Juin 2014 - 20:37

    je vais tenter avec le tien :)



    :heart: :heart:
    Allison01
    Allison01
    FémininAge : 39Messages : 225

    Jeu 12 Juin 2014 - 22:34

    merci Very Happy
    Toxic.Sunny
    Toxic.Sunny
    MasculinAge : 30Messages : 10

    Ven 13 Juin 2014 - 17:22

    Merci ! Very Happy
    [W]endy
    [W]endy
    FémininAge : 33Messages : 117

    Lun 16 Juin 2014 - 19:01

    Merci (:
    ColorTime'Less
    ColorTime'Less
    FémininAge : 26Messages : 106

    Dim 22 Juin 2014 - 16:17

    parfait !
    Simple et original Very Happy
    Sam-sam
    Sam-sam
    MasculinAge : 31Messages : 40

    Dim 22 Juin 2014 - 17:58

    Merci
    Zoé
    Zoé
    FémininAge : 24Messages : 189

    Sam 28 Juin 2014 - 12:38

    merci !



    QEEL en 3 colones + Chatbox 274643signaaaa
    x_Titia
    x_Titia
    FémininAge : 32Messages : 92

    Jeu 3 Juil 2014 - 14:42

    merci
    Myfanwi
    Myfanwi
    FémininAge : 26Messages : 97

    Dim 13 Juil 2014 - 21:53

    Merci Very Happy
    DaZeli
    DaZeli
    FémininAge : 28Messages : 377

    Lun 14 Juil 2014 - 1:11

    C'est bien sympa! Merci!
    Anonymous
    Invité

    Mer 16 Juil 2014 - 13:23

    Sublime :)
    Contenu sponsorisé


      La date/heure actuelle est Mar 19 Mar 2024 - 9:09