<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Un système d'onglet en javascript</title>
<script type="text/javascript">
//<!--
function change_onglet(name)
{
document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
document.getElementById('contenu_onglet_'+name).style.display = 'block';
anc_onglet = name;
}
//-->
</script>
<style type="text/css">
a img
{
border: none;
}
.onglet
{
position : center;
display:inline-block;
margin-left:3px;
margin-right:3px;
padding:5px;
font-size : 11px;
color : #ffffff;
text-align: center;
cursor:pointer;
}
.onglet_0
{
font-variant : normal;
-moz-border-radius : 9px;
margin : 5px;
background: #576979;
}
.onglet_1
{
font-variant : small-caps;
-moz-border-radius : 9px;
margin : 5px;
background: #1e4265;
padding-bottom:4px;
}
.contenu_onglet
{
color : #ffffff;
height : 800px;
overflow : auto;
-moz-border-radius : 9px;
margin-top:-1px;
padding:5px;
display:none;
}
ul
{
margin-top:0px;
margin-bottom:0px;
margin-left:-10px
}
h1
{
margin:0px;
padding:0px;
}
.box
{
background: #576979;
padding : 5px;
-moz-border-radius : 15px;
-webkit-border-radius : 15px;
border-radius : 15px;
color : #ffffff;
font-size : 11px;
font-variant : small-caps;
text-align : center;
}
.u
{
text-shadow : 0px 0px 5px #ffffff;
font-weight : bold;
</style>
</head>
<body>
<center><table>
<tr>
<td class="box"><img src="http://s2.noelshack.com/uploads/images/17420788066968_galerie.png"><br> <span class="u">Nom de graphiste :</span> Desproduction<br>
<span class="u">Logiciels :</span> Adobe Photoshop CS4 & ImageReady CS2<br>
<span class="u">Graph' depuis :</span> 2004 </td>
</tr>
</table></center>
<div class="systeme_onglets">
<div class="onglets"><center>
<span class="onglet_0 onglet" id="onglet_quoi" onmouseover="javascript:change_onglet('quoi');">Signatures</span>
<span class="onglet_0 onglet" id="onglet_qui" onmouseover="javascript:change_onglet('qui');">Icons</span>
<span class="onglet_0 onglet" id="onglet_pourquoi" onmouseover="javascript:change_onglet('pourquoi');">Avatars</span>
<span class="onglet_0 onglet" id="onglet_otw" onmouseover="javascript:change_onglet('otw');">LA</span>
<span class="onglet_0 onglet" id="onglet_design" onmouseover="javascript:change_onglet('design');">Designs Forums</span></center>
</div>
<div class="contenu_onglets">
<div class="contenu_onglet" id="contenu_onglet_quoi">
<div style="font-size: 10px; font-variant : small-caps; text-align : center">
<img src="http://s2.noelshack.com/uploads/images/10834876104030_killmyself2.png"><br><br>
<img src="http://s2.noelshack.com/uploads/images/20321797137048_assassinscreed2.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/17752066425819_sayonara.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/496744040628_sayonara2.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/14627571646545_girlofdestruction.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/12377265759639_hibari.png"><br><br>
<img src="http://s2.noelshack.com/uploads/images/20957316248781_destiny_angel.png"><br><br>
<img src="http://s2.noelshack.com/uploads/images/2712315611313_furioussoul.png"><br><br>
<img src="http://www.noelshack.com/up/aac/adangerousmind2-fbd8b6b728.png"><br>
<img src="http://www.noelshack.com/up/aac/eternalpain-876fdd6414.png"><br><br>
<img src="http://www.noelshack.com/up/aac/lookme-8ddecd4344.png"><br><br>
<img src="http://www.noelshack.com/up/aac/songoflight-cf07611a25.png"><br><br>
<img src="http://www.noelshack.com/up/aac/soulofdarkness-fe840a2278.png"><br><br>
<img src="http://www.noelshack.com/up/aac/behuman-d0deacd666.png"><br><br>
<img src="http://s2.noelshack.com/uploads/images/19346895896922_breakingthedark1b.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/8984141146035_breakingthedark2.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/5872219999272_breakingthedark3.png" border="0" alt="" /><br><br>
<img src="http://www.noelshack.com/up/aac/mysteriousmagic-9d7e3daf96.png"><br><br>
<img src="http://www.noelshack.com/up/aac/thelightofdarkness2-0975ac3362.png"><br><br>
<img src="http://www.noelshack.com/up/aac/ichigo-bd96237f94.png"><br><br>
<img src="http://www.noelshack.com/up/aac/musicislifen-f64af41c65.png"><br><br>
<br>
<img src="http://s2.noelshack.com/uploads/images/17946669593556_lonely.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/2519676067194_smock.png" border="0" alt="" /><br><br>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_qui">
<center> <img src="http://s2.noelshack.com/uploads/images/3856990912335_6996.png"> <img src="http://s2.noelshack.com/uploads/images/974506789575_biohazard.png"> <img src="http://s2.noelshack.com/uploads/images/3590513862705_chrissheva.png"> <img src="http://s2.noelshack.com/uploads/images/8111556783198_chrno.png"> <img src="http://s2.noelshack.com/uploads/images/6389494866612_claire2.png"> <img src="http://s2.noelshack.com/uploads/images/7222648182948_coloiconm.png"> <img src="http://s2.noelshack.com/uploads/images/9895184362602_dancewithme.png"> <img src="http://s2.noelshack.com/uploads/images/6270896137671_darkside.png"> <img src="http://s2.noelshack.com/uploads/images/3414440501802_darkside2.png"> <img src="http://s2.noelshack.com/uploads/images/14582369517210_everybody_lies.png"> <img src="http://s2.noelshack.com/uploads/images/2182351633011_goku.png"> <img src="http://s2.noelshack.com/uploads/images/12007507949118_goku2.png"> <img src="http://s2.noelshack.com/uploads/images/13542369417621_house.png"> <img src="http://s2.noelshack.com/uploads/images/21181181270040_house2.png"> <img src="http://s2.noelshack.com/uploads/images/10911137637114_house3.png"> <img src="http://s2.noelshack.com/uploads/images/3370002066090_house4.png"> <img src="http://s2.noelshack.com/uploads/images/17150556522825_iamadreamer.png"> <img src="http://s2.noelshack.com/uploads/images/3699581304870_iconestandalone.png"> <img src="http://s2.noelshack.com/uploads/images/7818480353772_iconfye4.png"> <img src="http://s2.noelshack.com/uploads/images/18359933643018_iconfyelittle.png"> <img src="http://s2.noelshack.com/uploads/images/15478826842512_iconfyeyui.png"> <img src="http://s2.noelshack.com/uploads/images/8879201621037_iconkara.png"> <img src="http://s2.noelshack.com/uploads/images/12676072615965_iconperci.png"> <img src="http://s2.noelshack.com/uploads/images/20327825364165_iconsak.png"> <img src="http://s2.noelshack.com/uploads/images/10216371660660_iconshiki.png"> <img src="http://s2.noelshack.com/uploads/images/6087785930523_iconshiki_2.png"> <img src="http://s2.noelshack.com/uploads/images/16411676078259_icontomoyoo.png"> <img src="http://s2.noelshack.com/uploads/images/7618763237481_imissyou.png"> <img src="http://s2.noelshack.com/uploads/images/15583247949357_imissyou2.png"> <img src="http://s2.noelshack.com/uploads/images/19179491898996_leons.png"> <img src="http://s2.noelshack.com/uploads/images/10020448844901_lucy.png"> <img src="http://s2.noelshack.com/uploads/images/18280285168662_memories2.png"> <img src="http://s2.noelshack.com/uploads/images/20532451599495_memoriesjoshua.png"> <img src="http://s2.noelshack.com/uploads/images/15795502701759_motoko2.png"> <img src="http://s2.noelshack.com/uploads/images/14063405988753_nico.png"> <img src="http://s2.noelshack.com/uploads/images/635955548085_nico2.png"> <img src="http://s2.noelshack.com/uploads/images/15165364991832_rosette.png"> <img src="http://s2.noelshack.com/uploads/images/20073846914550_shaolan.png"> <img src="http://s2.noelshack.com/uploads/images/21053139195528_shiki.png"> <img src="http://s2.noelshack.com/uploads/images/8127793629351_why.png"> <img src="http://s2.noelshack.com/uploads/images/18261804516912_destinyangel.png"> <img src="http://s2.noelshack.com/uploads/images/4186606667463_furiousoul.png"> </center>
</div>
<div class="contenu_onglet" id="contenu_onglet_pourquoi">
<center>
<img src="http://s2.noelshack.com/uploads/images/21070223286948_hibari.png" border="0" alt="" /> <img src="http://s2.noelshack.com/uploads/images/15140303498232_lonely.png"> <img src="http://s2.noelshack.com/uploads/images/19258116515748_admin.png"> <img src="http://s2.noelshack.com/uploads/images/6700192703721_muku.png"> <img src="http://s2.noelshack.com/uploads/images/717524530371_mukuro.png"> <img src="http://s2.noelshack.com/uploads/images/18142251363423_hiba.png"> <img src="http://s2.noelshack.com/uploads/images/18975782851938_mukufran.png"> <img src="http://s2.noelshack.com/uploads/images/14628439849716_hibariblood.png"></center>
</div>
<div class="contenu_onglet" id="contenu_onglet_otw">
<center>
<img src="http://s2.noelshack.com/uploads/images/11590359848100_freeyourimagination2.png" border="0" alt="" /><br><br>
<img src="http://s2.noelshack.com/uploads/images/19120362202557_musicislife.png" border="0" alt="" /></center>
</div>
<div class="contenu_onglet" id="contenu_onglet_design">
<center>
<span style="color : #576979; text-shadow : 1px 1px 1px black; font-size : 11px">Cliquez sur les bann' pour avoir un aperçu</span><br>
<a href="http://s2.noelshack.com/uploads/images/12494056469400_screenv6.png" target="_blank"><img src="http://s2.noelshack.com/uploads/images/9462269358432_minibann.png"></a><br><br>
<a href="http://s2.noelshack.com/uploads/images/18373676568588_screen.png" target="_blank" style="border : none;"><img src="http://s2.noelshack.com/uploads/images/7144148323719_crazygirl.png"></a><br><br>
<a href="http://s2.noelshack.com/uploads/images/2401587597222_screen.png" target="_blank"><img src="http://s2.noelshack.com/uploads/images/16520809903785_minibann.png"></a><br><br>
<a href="http://s2.noelshack.com/uploads/images/13017933336474_v3th.png" target="_blank"><img src="http://www.noelshack.com/up/aac/thedreammustend-91e7cf6695.png"></a><br><br>
<a href="http://www.noelshack.com/up/aac/screen-0b3bc79e63.png" target="_blank"><img src="http://www.noelshack.com/up/aab/mydearfeather-eb522ca830.png"></a><br><br>
</center>
</div>
</div>
</div>
<script type="text/javascript">
//<!--
var anc_onglet = 'quoi';
change_onglet(anc_onglet);
//-->
</script>
Sujet: NaY'art ~ 
Mer 21 Juil - 14:48
