Sujets similaires

Bonjour, bonsoir.
Aujourd'hui, j'ai décidé de coder une petite page d'accueil avec onglets pour navigation...
Et le problème, c'est que les onglets se mélangent! o_o Oui, ça à l'air surnaturel, mais ils se mélangent et à chaque actualisation, ils se mélangent de manière totalement aléatoire!
Dans mon malheur, les onglets correspondent bien à chaque contenue...
Quelques images: www.1;www.2;www.3

Je fournis donc le html:

Code:: <div class="systab s_float montab1">
<div>
<span class="mononglet">Onglet1</span>
contexte, news & navigation rapide
</div>
<div>
<span class="mononglet">Onglet2</span>
staff
</div>
<div>
<span class="mononglet">Onglet3</span>
prédéfinis
</div><div>
<span class="mononglet">Onglet4</span>
événements
</div><div>
<span class="mononglet">Onglet5</span>
Crédits
</div>
</div>

et le css:

Code:: /* .systab .tab => les onglet */
.systab .tab {
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #676767;
border: 1px solid #000;
cursor: pointer;
width:100px;
height:100px;}
/* .systab .tab:hover => les onglets survolés */
.systab .tab:hover {
background: #b8efa1;
color: #487f31;
border-color: #487f31;
}
/* .systab .tab.selected => les onglets sélectionnés */
.systab .tab.selected{
color: #ccc;
background: #333;
}
/* .systab .contents => les conteneurs des contenus associés aux onglets */
.systab .contents {
margin-top: 1px;
margin-bottom: 1px;
color: #000;
background: #fff;
border: 1px solid #000;
padding: 10px;
width:700px;
height:500px;
}
/* style des onglets si ils sont à gauche ou à droite */
.systab.s_float .tab,.systab.s_float .tab {
display: block;
margin: 5px;
}
/* flottement des conteneurs si les onglets sont à gauche où à droite */
.systab.s_float .tabs,.systab.s_float .contents {
float: left;
}

.montab1 .tab {
border-radius: 10px;
}
.montab1 .contents {
width:700px;
height:500px;
margin-right: 30px;
border: 1px dashed blue;
background: #eef;
}

.montab1 .mononglet {
color: blue;
background: #eef;
width:100px;
height:100px;}

Si besoin, je peux aussi fourni le java script.
Merci d'avance pour vos réponse & bonnes vacances! c:

Oh oh oh, un problème surnaturel \ o /. Un peu dans fantasy dans notre monde morne
~

Si les onglets se mélangent aléatoirement c'est sûrement du au JS. Pourrait tu me le fournir ? (:
Serait il possible d'avoir aussi le lien où le problème est rencontré ? ^____^

Un peu de magie, ça fait du bien. c:
Voici le code JS:

Code:: $(function(){
var d=function(){if($(this).is(".selected")) return;var a=$(this).closest(".systab");a.find(".selected").removeClass("selected").filter(".content")[a.is(".s_slide")?"slideUp":a.is(".s_fade")?"fadeOut":"hide"](+((a.attr("class")||"").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/)||["",500])[1]);$(this).addClass("selected").data("content").addClass("selected").stop(!0,!0)[a.is(".s_slide")?"slideDown":a.is(".s_fade")?"fadeIn":"show"](+((a.attr("class")||"").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/)||["",500])[1])};$("div.systab").each(function(){var a=$("> div",this).detach(),c=[],b;$(this).html('<div class="'+($(this).is(".s_bottom")?"contents":"tabs")+'"></div><div class="'+($(this).is(".s_bottom")?
"tabs":"contents")+'"></div>');$(a).each(function(){b=$(this).children(":first");b.is("span")?(c=$(c).add($(b).addClass("tab").data("content",$(this))),$(this).addClass("content").data("tab",b)):$(this).remove()});$("> div.tabs",this).append(c);$("> div.contents",this).append(a);b=$(".content:first,.content.selected",this).last();$(b).addClass("selected").siblings().hide();$(b).data("tab").addClass("selected")}).on("click",".tab",d).filter(".s_hover").on("mouseenter",".tab",d)
});

ainsi que mon forum de test~

Code:: http://gakuen-no-gin.forumactif.org/

Ce genre de chose... n'arrive qu'à moi. xD
Merci beaucoup de ton aide. c:

edit: J'ai laisser le html et le css assez... "vierge" pour que ce soit plus facilement modifiable en vue de ce problème. xDD

Bon le problème vient du JS, j'ai identifié à quel partie du JS le html des onglets est généré... Mais je comprends pas pourquoi ça se mélange Sad

Par contre, c'est bizarre, sur Firefox j'ai pas de problème de "mélange" alors que sur Chrome ou IE si O0.

Là franchement je pense que ça me dépasse Sad

Okidoki. xDD
Au pire, c'est pas grave, j'abandonne l'idée, mais je laisse le problème ouvert, si jamais d'autres personnes peuvent le régler. c:
Merci quand même. c:

Problème d'onglet qui se "mélangent".

Problème d'onglet qui se "mélangent".

Sujets similaires

Sujets similaires

Partenaires Or