Accueil
Créer un forumOnglet dans message
3 participants
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
Onglet dans message
par Masaru Lun 29 Juil 2013 - 20:32
Bonjour à tous et à toutes !
Alors voilà, je voulais insérer un tableau à onglet dans un post, pour ça j'ai trouvé un sujet sur forumactif expliquant comment faire ( Cliquez-ici ).
J'ai fait comme c'était expliqué, dans une page HTML j'ai posté le code suivant :
Et dans mon message le code suivant en variant la taille du tableau :
Ce qui me donne ceci :
C'est donc normal. Seulement lorsque je modifie le titre des Onglets (à savoir Onglet 1 etc), ça me déforme le tableau et j'obtiens quelque chose du genre :
J'ai quand même essayé de modifier auparavant la taille du tableau pour voir si mes onglets s'alignaient, mais non.
Je fait donc appel à votre aide pour savoir comment je peux faire pour que mes onglets restent tous alignés et ne se positionne pas les uns sous les autres ^^.
Merci à vous !!
Alors voilà, je voulais insérer un tableau à onglet dans un post, pour ça j'ai trouvé un sujet sur forumactif expliquant comment faire ( Cliquez-ici ).
J'ai fait comme c'était expliqué, dans une page HTML j'ai posté le code suivant :
- Spoiler:
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
.mon_onglet{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border: 1px solid #000;
cursor: pointer;
margin-bottom: -1px;
list-style: none;
}
.mon_onglet:hover{
background: #b8efa1;
}
.mon_onglet_selected{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #000;
background: #fff;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-left: 1px solid #000;
border-bottom: 1px solid #fff;
cursor: pointer;
margin-bottom: -1px;
list-style: none;}
.clear{
clear: both;
}
.mon_contenu{
color: #000;
background: #fff;
border: 1px solid #000;
padding: 10px;
line-height: normal;
font-size: 11px;}
#mes_contenus, #mes_onglets{
width: 400px;
margin: auto;}
-->
</style></head>
<body>
<script>
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';
}
}
}
}
</script>
<div id="mes_onglets">
<ul><li id="o_1" class="mon_onglet_selected" onclick="changeOnglet(this);">Onglet 1</li>
<li id="o_2" class="mon_onglet" onclick="changeOnglet(this);">Onglet 2</li>
<li id="o_3" class="mon_onglet" onclick="changeOnglet(this);">Onglet 3</li>
<li id="o_4" class="mon_onglet" onclick="changeOnglet(this);">Onglet 4</li>
<div class="clear"><div id="mes_contenus">
<div id="co_1" class="mon_contenu">Mon contenu 1</div>
<div id="co_2" class="mon_contenu" style="display: none;">Mon contenu 2</div>
<div id="co_3" class="mon_contenu" style="display: none;">Mon contenu 3</div>
<div id="co_4" class="mon_contenu" style="display: none;">Mon contenu 4</div>
</div></div></ul></div>
</body>
</html>
Et dans mon message le code suivant en variant la taille du tableau :
- Spoiler:
- Code:
<IFRAME src="LIEN DE LA PGE HTML" width=xxx height=xxx scrolling=no frameborder=0 > </IFRAME>
Ce qui me donne ceci :
- Spoiler:
C'est donc normal. Seulement lorsque je modifie le titre des Onglets (à savoir Onglet 1 etc), ça me déforme le tableau et j'obtiens quelque chose du genre :
- Spoiler:
J'ai quand même essayé de modifier auparavant la taille du tableau pour voir si mes onglets s'alignaient, mais non.
Je fait donc appel à votre aide pour savoir comment je peux faire pour que mes onglets restent tous alignés et ne se positionne pas les uns sous les autres ^^.
Merci à vous !!
Dernière édition par Masaru le Mar 30 Juil 2013 - 0:53, édité 1 fois
Masaru- Nouveau membre
- Messages : 16
Inscrit(e) le : 26/07/2013
Re: Onglet dans message
par _backdraft_ Lun 29 Juil 2013 - 23:44
Bonsoir,
Je pense qu'il faut augmenter la largeur de l'iframe et non du tableau.
Cordialement
Backdraft
Je pense qu'il faut augmenter la largeur de l'iframe et non du tableau.
Cordialement
Backdraft
_backdraft_- Membre habitué
-
Messages : 1509
Inscrit(e) le : 05/03/2010 -
Re: Onglet dans message
par Masaru Mar 30 Juil 2013 - 0:32
Bonsoir,
Tout d'abord merci pour votre aide ^^!
Justement, je me suis mal exprimé, désolé, c'est la largeur de l'iframe que je modifie et ça déforme uniquement le forum, sans résoudre le soucis. Dans le html si je rajoute " width " dans la div "mon onglet" ça modifie la largeur du cadre de l'onglet mais ça ne les aligne toujours pas... ^^'
Tout d'abord merci pour votre aide ^^!
Justement, je me suis mal exprimé, désolé, c'est la largeur de l'iframe que je modifie et ça déforme uniquement le forum, sans résoudre le soucis. Dans le html si je rajoute " width " dans la div "mon onglet" ça modifie la largeur du cadre de l'onglet mais ça ne les aligne toujours pas... ^^'
Masaru- Nouveau membre
- Messages : 16
Inscrit(e) le : 26/07/2013
Re: Onglet dans message
par Lixyr Mar 30 Juil 2013 - 0:40
Bonsoir.
Le problème vient du fait que la largeur que doit prendre au total vos onglets est égale à 400 :
la valeur est trop petite, et donc comme les onglets prennent trop de places, ils se mettent les uns sous les autres. Augmentez cette valeur jusqu'à ce que ça rentre. ^^
Le problème vient du fait que la largeur que doit prendre au total vos onglets est égale à 400 :
- Code:
#mes_contenus, #mes_onglets{
width: 400px;
margin: auto;}
la valeur est trop petite, et donc comme les onglets prennent trop de places, ils se mettent les uns sous les autres. Augmentez cette valeur jusqu'à ce que ça rentre. ^^
♢ Pour faciliter les recherches, mettez un titre explicite.
♢ Remerciez
le message qui vous a aidé pour que celui-ci soit mis en évidence.♢ Épinglez votre sujet en résolu
pour prévenir la modération.
Lixyr- Aidactive
-
Messages : 7448
Inscrit(e) le : 23/07/2010 -
Re: Onglet dans message
par Masaru Mar 30 Juil 2013 - 0:53
Ah oui en effet ! Je n'avais pas essayé de modifier cette valeur, et tout s'aligne lorsque je l'augmente.
Merci beaucoup ! =)
Merci beaucoup ! =)
Masaru- Nouveau membre
- Messages : 16
Inscrit(e) le : 26/07/2013
Sujets similaires» Catégories en onglet : afficher plusieurs catégories/onglet dans le 1er onglet
» Lien qui s'ouvre dans la PA et non dans un autre onglet
» Tableau a onglet dans le message d'accueil
» problème de systhème d'onglet dans un message
» Peut-on metre un tableau à onglet dans un message ?
» Lien qui s'ouvre dans la PA et non dans un autre onglet
» Tableau a onglet dans le message d'accueil
» problème de systhème d'onglet dans un message
» Peut-on metre un tableau à onglet dans un message ?
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