Commande de Cytrius sur Never Utopia [QEEL]

Voir le sujet précédent Voir le sujet suivant Aller en bas
avatar

Messages : 40
Age du personnage : 18
Date d'inscription : 03/01/2010

Feuille de personnage
Ton Carnet:

Parchemin signé Ocelline le Sam 11 Mai - 22:37
Coucou,

Aperçu :
Spoiler:
 

QEEL sur 1000*1000. Image avec rotation au survol de 7 degrés. 3 blocs pour les infos du QEEL. Groupes, Statistiques et Anniversaire. Reliés entre eux par des pointillés (image positionné en css). Pas de personnalisation d'écriture sauf effet au survol des Groupes.

Template Index-Body : (uniquement partie qeel)



Code:
<div id ="backgroundqeel"> <!-- BEGIN disable_viewonline -->
 
<div style="margin:auto;text-align:center;width:100%">
<table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
 
   
       
    <tr> <td class="row1" rowspan="6" align="center" valign="middle"> <div class="imgqeel">  <img src="http://i77.servimg.com/u/f77/17/98/42/85/qqel_t10.jpg" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" />
      </div> </td>
     
 
  <tr>
   
    <td class="row1"> <img src="http://www.solutions-zen-bamboo.com/medias/diag/p-tl-br.png" class="reliure "><div class="backgroundgroupes">      <span class="groupename"> <a href="http://ocelline-testdesign.forumactif.org/g2-moderateurs?tt=1" class="groupename"> Administrateurs</a></span> <br/>
      <span class="groupename"> <a href="http://ocelline-testdesign.forumactif.org/g2-moderateurs?tt=1" class="groupename">Modérateurs</a></span> <br/>
      <span class="groupename"> <a href="http://ocelline-testdesign.forumactif.org/g2-moderateurs?tt=1" class="groupename"> Star</a></span> <br/>
      <span class="groupename"> <a href="http://ocelline-testdesign.forumactif.org/g2-moderateurs?tt=1" class="groupename">People</a></span> <br/>
            <span class="groupename"> <a href="http://ocelline-testdesign.forumactif.org/g2-moderateurs?tt=1" class="groupename">Members</a></span>  </div> </tr> </td>
     
          <td class="row1" width="100%"><img src="http://www.solutions-zen-bamboo.com/medias/diag/p-tl-br.png" class="reliure2 "><span class="gensmall"><div class="backgroundgroupes2"><span id="nb_users">{TOTAL_USERS}<script type="text/javascript">document.getElementById('nb_users').innerHTML=document.getElementById('nb_users').innerHTML.replace(/membres enregistrés/,"Alysiens enregistrés");</script></span><br />
            <span id="nb_messages">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/Nos membres ont posté un total de/,"Nos Alysiens on posté en tout");</script></span><br />
            <span id="last_user">{NEWEST_USER}<script type="text/javascript">document.getElementById('last_user').innerHTML=document.getElementById('last_user').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier Alysien à nous avoir rejoint est");</script></span>
            <br/>
            <span id="connected">{TOTAL_USERS_ONLINE}<script type="text/javascript">document.getElementById('connected').innerHTML=document.getElementById('connected').innerHTML.replace(/utilisateurs en ligne/,"alysiens parmi nous");</script></span><br />
            <span id="record">{RECORD_USERS}<script type="text/javascript">document.getElementById('record').innerHTML=document.getElementById('record').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"La fois où le plus d'Alysiens ont étés réunis ici en même temps,ils étaient");</script></span><br />
      <br />
         
          <span id="encemoment">{LOGGED_IN_USER_LIST}<script type="text/javascript">document.getElementById('encemoment').innerHTML=document.getElementById('encemoment').innerHTML.replace(/
            Utilisateurs enregistrés :/,"Alysiens ici présents");</script></span>
            <table id ="membersco"> <tr> <td>  <span id="24h"> {L_CONNECTED_MEMBERS}<script type="text/javascript">document.getElementById('24h').nextSibling.firstChild.firstChild.innerHTML=document.getElementById('24h').nextSibling.firstChild.firstChild.innerHTML.replace(/Membres connectés/,'Nostalgiques présents');</script>
              </span>  </td> </tr> </table></div>
 
 
          <img src="http://www.solutions-zen-bamboo.com/medias/diag/p-tl-br.png" class="reliure3 "> <div class="backgroundgroupes3">
 
 
          <table id="anniversaire "> <tr> <td>  {L_WHOSBIRTHDAY_TODAY}
                    <span id="anniversaire">
        </span>
        {L_WHOSBIRTHDAY_WEEK}
        <script type="text/javascript">document.getElementById('anniversaire').parentNode.innerHTML=document.getElementById('anniversaire').parentNode.innerHTML.replace(/Membres fêtant leur anniversaire aujourd'hui/,"Les Alysiens qui fêtent leurs anniv sont ").replace(/Membres fêtant leur anniversaire dans les ([0-9]+) prochains jours/,"Les Alysiens fêtant leurs anniv dans les prochains jours : ").replace(/Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun Alysien se fait plus vieux aujourd'hui").replace(/Aucun membre ne fête son anniversaire dans les ([0-9]+) prochains jours/,"Il n'y a pas d'Alysien qui fêtent leurs anniversaire prochainement");
            </script></td> </tr> </table>
           
   
           
             
    </table>
   
     
     
     
   

     
            <!-- END disable_viewonline --> 

CSS :

Code:
/* QEEL KAELIA UNIVERSE */

/* Fond du qeel et taille*/
#backgroundqeel {
 background:transparent!important;
  width:1000px;
  height:1000px;
 
}
/* Image du QEEL*/
.imgqeel {
 box-shadow: 3px 3px 3px white ;
  float:left;}
.imgqeel:hover {
-webkit-transform: rotate(7deg);
  -moz-transform: rotate(7deg);
  -ms-transform: rotate(7deg);
  -o-transform: rotate(7deg);
  transform: rotate(7deg);
}

/*Structure des blocs */
.backgroundgroupes {
background-color:darkcyan;
  color:white;
  width:150px;
  height:150px;
  float:left;
  margin-top:20px;
  margin-left:80px;
webkit-border-radius: 20px 20px 20px 20px ;
  moz-border-radius:20px 20px 20px 20px ;
  ms-border-radius:20px 20px 20px 20px ;
  o-border-radius: 20px 20px 20px 20px;
  border-radius: 20px 20px 20px 20px;
  position:absolute;
}

.reliure {
  width:180px;
  height:70px;
  float:left;
  position:relative;
  margin-top:100px;
  margin-left:-4px;
}

.backgroundgroupes2{
background-color:darkcyan;
  color:white;
  width:250px;
  height:180px;
  float:right;
  margin-top:-150px;
  margin-left:285px;
webkit-border-radius: 20px 20px 20px 20px ;
  moz-border-radius:20px 20px 20px 20px ;
  ms-border-radius:20px 20px 20px 20px ;
  o-border-radius: 20px 20px 20px 20px;
  border-radius: 20px 20px 20px 20px;
  position:absolute;
}

.reliure2 {
  width:180px;
  height:70px;
  float:left;
  position:relative;
  margin-top:-150px;
  margin-left:220px;
}

table#membersco  {
 
  background-color:darkcyan!important;
  background:transparence!important;
  border:none!important;
  width:258px!important;
  margin-left:-4px;
 
 
}

.backgroundgroupes3{
background-color:darkcyan;
  color:white;
  width:210px;
  height:100px;
  float:right;
  margin-left:200px;
  margin-top:50px;
webkit-border-radius: 20px 20px 20px 20px ;
  moz-border-radius:20px 20px 20px 20px ;
  ms-border-radius:20px 20px 20px 20px ;
  o-border-radius: 20px 20px 20px 20px;
  border-radius: 20px 20px 20px 20px;
  position:absolute;
}

.reliure3 {
  width:180px;
  height:70px;
  float:left;
  position:relative;
  margin-left:118px;
  margin-top:-5px;
}

table#anniversaire td {
  background:none!important;
 
}

/* Groupes */

.groupename {
  font-size:11px;
  color:white;
  letter-spacing:3px;
 
}

a.groupename {
  font-size:11px;
  color:white;
  letter-spacing:3px;
 
}
.groupename:hover{
  font-size:11px;
  letter-spacing:3px;
  text-transform:uppercase;
  -webkit-transform: rotate(5deg);
  -moz-transform: rotate(5deg);
  -ms-transform: rotate(5deg);
  -o-transform: rotate(5deg);
  transform: rotate(5deg);
  color:black;
 
}


A:link {text-decoration: none !important;}
A:visited {text-decoration: none !important;}
A:active {text-decoration: none !important;}
A:hover {text-decoration: none !important;}

/* Fin du QEEL KAELIA UNIVERSE BY SELENE DE NEVER UTOPIA*/

Revenir en haut Aller en bas
Voir le profil de l'utilisateur

Commande de Cytrius sur Never Utopia [QEEL]

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Sujets similaires

-
» QEEL Personnalisé [Lixyr]
» [Résolu] Commande cmd
» commande menu "Enregistrer"
» Commande et retrosignalisation d'aiguilles + RRTC
» nouvelle commande

Forum de test de Ocelline :: 
 :: Commandes de codage
-