Problème affichage onglet message d'accueil
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Problème affichage onglet message d'accueil
Bonjour !
J'ai besoin d'aide pour un affichage d'onglet en page d'accueil. Il s'avère que lorsque l'on arrive sur la page en question, tous les contenus des onglets sont affichés les uns en dessous des autres. Cependant, lorsque je clique sur l'un des onglets, le problème disparait.
Voici mon CSS
voici mon code Javascript
Et enfin, voici mon code html du message d'accueil
Merci d'avance pour l'aide apportée.
J'ai besoin d'aide pour un affichage d'onglet en page d'accueil. Il s'avère que lorsque l'on arrive sur la page en question, tous les contenus des onglets sont affichés les uns en dessous des autres. Cependant, lorsque je clique sur l'un des onglets, le problème disparait.
Voici mon CSS
- code CSS:
- .mon_onglet{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #fff;
background: #000;
border: 1px solid #fff;
cursor: pointer;
margin-bottom: -1px;
list-style: none;
}
.mon_onglet:hover{
background: #0000ff;
}
.mon_onglet_selected{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #f00;
background: #000;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
border-bottom: 1px solid #000;
font-weight : bold;
cursor: pointer;
margin-bottom: -1px;
list-style: none;}
.clear{
clear: both;
}
.mon_contenu{
color: #fff;
background: #000;
border: 1px solid #fff;
padding: 10px;
line-height: normal;
font-size: 11px;
}
#mes_contenus, #mes_onglets{
width: 600px;
margin: auto;}
voici mon code Javascript
- Code JS:
- function changeOnglet(_this){
var getOnglets = document.getElementById('mes_onglets').getElementsByTagName('li');
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';
}
}
}
}
Et enfin, voici mon code html du message d'accueil
- Code message d'accueil:
- <table>
<tr valign="top"><td>
<img src="http://b5.img.v4.skyrock.net/b55/sangokusayain/pics/1417292763_small.jpg" width="293" height="400"></td>
<td><div id="mes_onglets">
<ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Accueil</li>
<li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">Informations</li>
<li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Inscriptions DB 300</li>
<div class="clear"><div id="mes_contenus">
<div id="co_1" class="mon_contenu">Bonjour</div>
<div id="co_2" class="mon_contenu"><FONT size=2>La publicité pour les membres est désactivée jusqu'au 13 septembre 2011
Dernière phase de bêta-test pour le système de jeu.
</FONT></div>
<div id="co_3" class="mon_contenu"><center><STRONG><FONT size=2.5>Inscriptions à Dragon Ball 300</font><br><br><FONT color=00FF00 size=4>Ouvertes</FONT></STRONG>
<br><br><FONT size=2.5>14 places restantes</font></center></div>
</div></div></ul></div></td></tr></table>
Merci d'avance pour l'aide apportée.
Dernière édition par Avhdotisab le Mar 23 Aoû 2011, 09:02, édité 1 fois
Re: Problème affichage onglet message d'accueil
Bonjour,
Il vous manque un petit bout de code dans vos contenu 2 et 3 style="display: none;". Cela permet de les masquer .
Essayez comme ceci:
Cordialement.
Il vous manque un petit bout de code dans vos contenu 2 et 3 style="display: none;". Cela permet de les masquer .
Essayez comme ceci:
- Code:
<table>
<tr valign="top"><td>
<img src="http://b5.img.v4.skyrock.net/b55/sangokusayain/pics/1417292763_small.jpg" width="293" height="400"></td>
<td><div id="mes_onglets">
<ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Accueil</li>
<li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">Informations</li>
<li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Inscriptions DB 300</li>
<div class="clear"><div id="mes_contenus">
<div id="co_1" class="mon_contenu">Bonjour</div>
<div id="co_2" class="mon_contenu" style="display: none;"><FONT size=2>La publicité pour les membres est désactivée jusqu'au 13 septembre 2011
Dernière phase de bêta-test pour le système de jeu.
</FONT></div>
<div id="co_3" class="mon_contenu" style="display: none;"><center><STRONG><FONT size=2.5>Inscriptions à Dragon Ball 300</font><br><br><FONT color=00FF00 size=4>Ouvertes</FONT></STRONG>
<br><br><FONT size=2.5>14 places restantes</font></center></div>
</div></div></ul></div></td></tr></table>
Cordialement.
Invité- Invité
Re: Problème affichage onglet message d'accueil
Parfait. Merci beaucoup !
Sujets similaires
» problème de systhème d'onglet dans un message
» Probleme affichage par onglet
» Problème d'affichage PA en onglet
» Problème d'onglet et leur affichage.
» Problème d'affichage du titre sur l'onglet du navigateur internet
» Probleme affichage par onglet
» Problème d'affichage PA en onglet
» Problème d'onglet et leur affichage.
» Problème d'affichage du titre sur l'onglet du navigateur internet
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum