/* ======================================
ONGLETS PA - STAFF
=========================================
Début du code - CSSACTIF Faucon
=========================================*/

/*zone groupes*/
.groupes {/*aspect des groupes*/
margin: 0;
}
.mon_onglet, .mon_onglet_selected { /*position des onglets*/
display:inline-block;
}
 
/*zone de description des groupes*/
.descgroupes { /*description des groupes*/
width:190px;
padding: 10px;
margin: 0;
border: 1px double #121212;
}

#mon_contenu, .descgroupes { height : 64px; }
.mon_contenu { display:block; }

/*Fin du code*/

<div id="mes_onglets">
 
<div id="o_1" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/278064jorkelllogo.gif" />
</div>
 
<div id="o_2" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/617167joralogo.gif" />
</div>
 
<div id="o_3" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/694355lorkhanlogo.gif" />
</div>
 
<div id="o_4" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/237186ethainlogo.gif" />
</div>
 
<div id="o_5" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/655187synriclogo.gif" />
</div>
 
<div id="o_6" class="mon_onglet" onmouseover="changeOnglet(this);">
 <img src="http://img11.hostingpics.net/pics/922477lehvinialogo.gif" />
</div>
 
</div>
 
<div class="descgroupes">
 
<div id="mes_contenus">
 
<div id="co_1" class="mon_onglet">
 
<div class="decstaff">
 Jorkell Ravncrone
</div><span style="font-size: 10px;">USURPATEUR</span>
</div>
 
<div id="co_2" class="mon_contenu">
 
<div class="decstaff">
 Jora Ebonhand
</div><span style="font-size: 10px;">HÉRITIÈRE LÉGITIME D'IBENHOLT</span>
</div>
 
<div id="co_3" class="mon_contenu">
 
<div class="decstaff">
 Lorkhan Ravncrone
</div><span style="font-size: 10px;">MAIN DU ROI</span>
</div>
 
<div id="co_4" class="mon_contenu">
 
<div class="decstaff">
 Ethaìn Lonerider
</div><span style="font-size: 10px;">REINE DE HVITTJELL</span>
</div>
 
<div id="co_5" class="mon_contenu">
 
<div class="decstaff">
 Synric Clanfell
</div><span style="font-size: 10px;">CONSEILLER DU ROI D'IBENHOLT</span>
</div>
 
<div id="co_6" class="mon_contenu">
 
<div class="decstaff">
 Lehvinia Dragonfall
</div><span style="font-size: 10px;">PRINCESSE D'ASKEVALE</span>
</div>
 
</div>
 
</div>

function changeOnglet(_this){
      var getOnglets = document.getElementById('mes_onglets').getElementsByTagName('div');
      for(var i = 0; i < getOnglets.length; i++){
          if(getOnglets[i].id){
            if(getOnglets[i].id == _this.id){
                getOnglets[i].className = 'mon_onglet_selected';
                document.getElementById('c' + _this.id).style.display = 'block';
            }
            else {
                getOnglets[i].className = 'mon_onglet';
                document.getElementById('c' + getOnglets[i].id).style.display = 'none';
            }
          }
      }
    }