AccueilAccueil  PortailPortail  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion    

Partagez | 
 

 Commande de Cytrius sur Never Utopia [QEEL]

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Ocelline

avatar

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

Feuille de personnage
Ton Carnet:

MessageSujet: Commande de Cytrius sur Never Utopia [QEEL]   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

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum de test de Ocelline :: 
 :: Commandes de codage
-
Sauter vers: