begin process at 2012 05 29 14:06:01
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

Javascript => Onglets intérefrences ?!

Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Javascript => Onglets intérefrences ?!

vendredi 2 avril 2010 à 11:23:19 | Javascript => Onglets intérefrences ?!

Jobs68
Bonjour,

Je suis actuellement en train de faire des onglets en javascript pour mon forum de test cependant j'ai un gros problèmes.
Voilà la forum

Comme vous pouvez le constater quand on passe d'un onglet à l'autre dans la première ligne les onglets du bas disparaisse et pleins d'autres bugs apparaissent aussi...
Pourtant au départ quand je n'avais fait que les onglets du haut tout fonctionnait... Quelqu'un aurait une solution svp ?
Je précise que je ne connais vraiment pas grand chose en Javascript et que ce système d'onglets à été fait en trouvant des parties du code sur le net puis modifier à ma guise.

Voilà mon template :

Onglets du bas :
Code Javascript :
{JAVASCRIPT}
<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">
.onglet
{
display:inline-block;
margin-left:30px;
margin-right:3px;
padding:3px;
cursor:pointer;
}
.onglet_0
{
background:#F8F8F8;
margin-bottom:1px;
}
.onglet_1
{
background:#D5E0FF;
background-image:url(http://garena.power-heberg.com/images/v4/fond2.png);
bakground-repeat:repeat-x;
padding:3px;
padding-left:4px;
padding-right:4px;
padding-bottom:4px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
border: none;
}

.onglet_0:first-letter {
	color: red;
	}

.onglet:first-letter {
	color: red;
	}

.contenu_onglet
{
background-color:#D5E0FF;
margin-top:-1px;
padding:5px;
display:none;
margin-bottom:0px;
}

.contenu_onglet1
{
background-color:#D5E0FF;
margin-top:-1px;
padding:0px;
display:none;
margin-bottom:0px;
}

ul
{
margin-top:0px;
margin-bottom:0px;
margin-left:-10px
}
h1
{
margin:0px;
padding:0px;
}

.blanc {
background-color:#F8F8F8;
padding:5px;
margin-top:10px;
margin-bottom:10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

h4 {
margin-top:-1px;
margin-bottom:4px;
background-image:url(http://garena.power-heberg.com/images/v4/fond3.png);
repeat:repeat-x;
font-size:7px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
border: none;
}

h5 {
margin-top:0px;
margin-bottom:4px;
background-image:url(http://garena.power-heberg.com/images/v4/fond1.png);
repeat:repeat-x;
font-size:7px;
    -moz-border-radius: 10px;
    -webkit-border-radius:1 0px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
border: none;
}
</style>
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
	<!-- BEGIN message_admin_titre -->
	<tr>
		<td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
	</tr>
	<!-- END message_admin_titre -->
	<!-- BEGIN message_admin_txt -->
	<tr>
		<td class="row1" rowspan="3" align="center" valign="middle">
		<div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
		</td>
	</tr>
	<!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
	<tr>
		<td width="100%" valign="top" align="center" class="row1">&nbsp;
			<label><span class="genmed">{L_USERNAME}:</span>&nbsp;<input class="post" type="text" size="10" name="username" /></label>&nbsp;
			<label><span class="genmed">{L_PASSWORD}:</span>&nbsp;<input class="post" type="password" size="10" name="password" /></label>&nbsp;
			{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /><br />
			<label><span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>&nbsp;

		</td>
	</tr>
</table>
</form>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}


<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
	<tr>
		<td width="100%" valign="top" align="center" class="row1">&nbsp;
			<span class="genmed">{L_USERNAME}:</span>&nbsp;
			<input class="post" type="text" size="10" name="username"/>&nbsp;
			<span class="genmed">{L_PASSWORD}:</span>&nbsp;
			<input class="post" type="password" size="10" name="password"/>&nbsp;
			{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /><br />
			<span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
			<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />&nbsp;
		</td>
	</tr>
</table>
</form>
<!-- END switch_user_login_form_footer -->

{CHATBOX_BOTTOM}
<br clear="all" />
<!-- ________________________________________________________________________________ -->
<div class="systeme_onglets">
<div class="onglets">
<span class="onglet_0 onglet" id="onglet_online" onMouseUp="javascript:change_onglet('online');">Qui est en ligne ?</span>
<span class="onglet_0 onglet" id="onglet_stats" onMouseUp="javascript:change_onglet('stats');">Statistiques</span>
<span class="onglet_0 onglet" id="onglet_staff" onMouseUp="javascript:change_onglet('staff');">Staff</span>
</div>
<div class="contenu_onglets1">
<table class="espace" BACKGROUND-image="http://garena.power-heberg.com/images/v4/fond1.png" width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<h5>&nbsp;</h5>
</table>
<div class="contenu_onglet" id="contenu_onglet_online">
<!-- ________________________________________________________________________________ -->
<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
	<tr>
		<td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
		<td class="row1" width="100%"><span class="gensmall">

<span class="gensmall" id="blabla">{TOTAL_POSTS}
<script type="text/javascript">document.getElementById('blabla').innerHTML=document.getElementById
('blabla').innerHTML.replace(/Nos membres ont posté un total de/,"Nous avons un total de");</script><script type="text/javascript">document.getElementById
('blabla').innerHTML=document.getElementById('blabla').innerHTML.
replace(/messages/,"messages postés sur le forum");</script><script type="text/javascript">document.getElementById</script></span><br />

<span class="gensmall" id="user">{TOTAL_USERS}
<script type="text/javascript">document.getElementById('user').innerHTML=document.getElementById
('user').innerHTML.replace(/Nous avons/,"Notre communauté compte actuellement");</script><script type="text/javascript">document.getElementById
('user').innerHTML=document.getElementById('miaou').innerHTML.
replace(/membres enregistrés/,"membres");</script><script type="text/javascript">document.getElementById</script></span><br />

		<span class="gensmall" id="newest">{NEWEST_USER}</span><script type="text/javascript">document.getElementById('newest').innerHTML=document.getElementById('newest').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier membre à avoir rejoins G-Arena est");</script></span></td>

	</tr>
	<tr>
		<br />
		<td class="row1">
<span class="gensmall" id="en ligne">{LOGGED_IN_USER_LIST}</span><script type="text/javascript">document.getElementById('en ligne').innerHTML=document.getElementById('en ligne').innerHTML.replace(/Utilisateurs enregistrés/,"Les membres en ligne en ce moment sont");</script></span>
</span></td>

	</tr>

<span class="gensmall" id="24">{L_CONNECTED_MEMBERS}</span>
<script type="text/javascript">document.getElementById('24').innerHTML=document.getElementById('24').innerHTML.replace(/Membres connectés au cours des 24 dernières heures/,"Les membres qui étaient connectés ces dernières 24 heures sont");
</script>

{L_WHOSBIRTHDAY_TODAY}


{L_WHOSBIRTHDAY_WEEK}


	
	
	<tr>
		<td class="row1"><span class="gensmall">{LEGEND}&nbsp;:&nbsp;{GROUP_LEGEND}</span></td>
	</tr>
</table>
<!-- END disable_viewonline -->
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center" background-color="#FFFFFF">
	<tr>
		<td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
		<td><span class="gensmall">{L_NEW_POSTS}</span></td>
		<td></td>
		<td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
		<td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
		<td>&nbsp;&nbsp;</td>
		<td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
		<td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
	</tr>
</table>
<!-- END switch_legend -->
<!-- ________________________________________________________________________________ -->
<div class="contenu_onglet" id="contenu_onglet_stats">
</div>
<!-- ________________________________________________________________________________ -->
<div class="contenu_onglet" id="contenu_onglet_staff">
</div>
</div>
</div>
<table class="espace1" BACKGROUND-image="http://garena.power-heberg.com/images/v4/fond3.png" width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<h4>&nbsp;</h4>
</table>
<script type="text/javascript">
//<!--
var anc_onglet = 'online';
change_onglet(anc_onglet);
//-->
</script>

{AUTO_DST}


Onglets du haut :
Code Javascript :
<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">
.onglet
{
display:inline-block;
margin-left:30px;
margin-right:3px;
padding:3px;
cursor:pointer;
}
.onglet_0
{
background:#F8F8F8;
margin-bottom:1px;
}
.onglet_1
{
background:#D5E0FF;
background-image:url(http://garena.power-heberg.com/images/v4/fond2.png);
bakground-repeat:repeat-x;
padding:3px;
padding-left:4px;
padding-right:4px;
padding-bottom:4px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
border: none;
}

.onglet_0:first-letter {
	color: red;
	}

.onglet:first-letter {
	color: red;
	}

.contenu_onglet
{
background-color:#D5E0FF;
margin-top:-1px;
padding:5px;
display:none;
margin-bottom:0px;
}

.contenu_onglet1
{
background-color:#D5E0FF;
margin-top:-1px;
padding:0px;
display:none;
margin-bottom:0px;
}

ul
{
margin-top:0px;
margin-bottom:0px;
margin-left:-10px
}
h1
{
margin:0px;
padding:0px;
}

.blanc {
background-color:#F8F8F8;
padding:5px;
margin-top:10px;
margin-bottom:10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

h4 {
margin-top:-1px;
margin-bottom:4px;
background-image:url(http://garena.power-heberg.com/images/v4/fond3.png);
repeat:repeat-x;
font-size:7px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
border: none;
}

h5 {
margin-top:0px;
margin-bottom:4px;
background-image:url(http://garena.power-heberg.com/images/v4/fond1.png);
repeat:repeat-x;
font-size:7px;
    -moz-border-radius: 10px;
    -webkit-border-radius:1 0px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:0px;
border: none;
}
</style>
</head>
<body>
<div class="systeme_onglets">
<div class="onglets">
<span class="onglet_0 onglet" id="onglet_forums" onMouseOver="javascript:change_onglet('forums');">Forums</span>
<span class="onglet_0 onglet" id="onglet_arenes" onMouseOver="javascript:change_onglet('arenes');">Arènes</span>
<span class="onglet_0 onglet" id="onglet_reglements" onMouseOver="javascript:change_onglet('reglements');">Règlements</span>
</div>
<div class="contenu_onglets1">
<table class="espace" BACKGROUND-image="http://garena.power-heberg.com/images/v4/fond1.png" width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<h5>&nbsp;</h5>
</table>
<div class="contenu_onglet" id="contenu_onglet_forums">
<table class="blanc" width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
	<tr>
		<td valign="bottom">
			<!-- BEGIN switch_user_logged_in -->
			<span class="gensmall">{LAST_VISIT_DATE}<br />
			{CURRENT_TIME}<br />
			</span>
			<!-- END switch_user_logged_in -->
			<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
		</td>
		<td class="gensmall" align="right" valign="bottom">
			<!-- BEGIN switch_user_logged_in -->
			<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
			<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
			<!-- END switch_user_logged_in -->
			<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
		</td>
	</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
	<tr>
		<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle">&nbsp;{catrow.tablehead.L_FORUM}&nbsp;</th>
		<th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
	</tr>
	<!-- END tablehead -->
	<!-- BEGIN cathead -->
	<tr>
		<!-- BEGIN inc -->
		<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
		<!-- END inc -->
		<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
			<h{catrow.cathead.LEVEL} class="hierarchy">
				<span class="cattitle">
					<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
				</span>
			</h{catrow.cathead.LEVEL}>
		</td>
		<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right">&nbsp;</td>
	</tr>
	<!-- END cathead -->
	<!-- BEGIN forumrow -->
	<tr>
		<!-- BEGIN inc -->
		<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
		<!-- END inc -->
		<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
			<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
		</td>
		<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
			<table width="100%"><tbody><tr><td><h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
               <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
            </span>
         </h{catrow.forumrow.LEVEL}></td><td style="padding-left: 40px; text-align: right;" class="gensmall">{catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.</td></tr></tbody></table>
			<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
			<span class="gensmall">
				<!-- BEGIN switch_moderators_links -->
				{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
				<!-- END switch_moderators_links -->
				{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
			</span>
		</td>
		<!-- BEGIN forum_link_no -->
		<td class="row3 over" align="center" valign="middle" height="50">
			<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
		</td>
		<!-- END forum_link_no -->
		<!-- BEGIN forum_link -->
		<td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
		<!-- END forum_link -->
	</tr>
	<!-- END forumrow -->
	<!-- BEGIN catfoot -->
	<tr>
		<!-- BEGIN inc -->
		<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
		<!-- END inc -->
		<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
	</tr>
	<!-- END catfoot -->
	<!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
<table class="blanc" width="100%" border="0" cellspacing="0" cellpadding="0">
	<tr>
		<td width="50%" valign="top">
			<!-- BEGIN switch_user_logged_in -->
			<span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a>
			<!-- END switch_user_logged_in -->
			<!-- BEGIN switch_delete_cookies -->
			<br /><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a>
			<!-- END switch_delete_cookies -->
			</span>
		</td>
		<td width="50%" align="right">
			<span class="gensmall">
				<!-- BEGIN switch_on_index -->
					<!-- BEGIN switch_delete_cookies -->
					<a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
					<!-- END switch_delete_cookies -->
				<!-- END switch_on_index -->
			</span>
		</td>
	</tr>
</table>
</div>

<div class="contenu_onglet" id="contenu_onglet_arenes">
<!-- ________________________________________________________________________________ -->
<table>
<tbody><tr>
<td colspan="3"><div class="titreFo"><a href="">A Venir</a></div></td></tr>
<tr>
<td colspan="1" valign="top" width="550px;" height="50">
<span class="genmed"><img src="" style="float: left;"><div class="descri"><font size="1pt"><i>Les arènes</i> sont l'endroit où l'on se bat. blablabla</font></div><br></span>
<span class="gensmall">
<center>
  <p><img alt="http://garena.power-heberg.com/images/v3/lesarenes.png" src="http://garena.power-heberg.com/images/v3/lesarenes.png" /></p>
  <table width="753" height="301" border="0" align="center">
    <tr align="center">
      <td width="366" valign="middle"><p><a href="http://forum.g-arena.fr/arene-des-duels-f22/"><img src="http://garena.power-heberg.com/images/v3/areneduels.png" alt="http://garena.power-heberg.com/images/v3/areneduels.png" align="absmiddle" /></a></p>
      <p><a href="http://forum.g-arena.fr/arene-photographie-f9/"><img src="http://garena.power-heberg.com/images/v3/arenephotographie.png" alt="http://garena.power-heberg.com/images/v3/arenephotographie.png" /></a></p></td>
      <td width="371" valign="middle"><p><a href="http://forum.g-arena.fr/arene-photo-effects-f7/"><img src="http://garena.power-heberg.com/images/v3/arenephotoeffects.png" alt="http://garena.power-heberg.com/images/v3/arenephotoeffects.png" /></a></p>
      <p><a href="http://forum.g-arena.fr/arene-logo-f10/"><img src="http://garena.power-heberg.com/images/v3/arenelogos.png" alt="http://garena.power-heberg.com/images/v3/arenelogos.png" /></a></p></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p><a href="http://forum.g-arena.fr/la-g-arena-cup-f11/"><img src="http://garena.power-heberg.com/images/v3/arenacoupe.png" alt="http://garena.power-heberg.com/images/v3/arenacoupe.png" /></a></p>
  <p>&nbsp;</p>
<p>&nbsp;</p>
</center>
</span>
</td>
</tr>
</tbody>
</table>
<!-- _________________________________________________________________________________ -->
</div>
<div class="contenu_onglet" id="contenu_onglet_reglements">
<table>
<tbody>

</tbody>
</table>
</div>
</div>
</div>
<table class="espace1" BACKGROUND-image="http://garena.power-heberg.com/images/v4/fond3.png" width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<h4>&nbsp;</h4>
</table>
<script type="text/javascript">
//<!--
var anc_onglet = 'forums';
change_onglet(anc_onglet);
//-->
</script>


Merci d'avance ;)
vendredi 2 avril 2010 à 12:43:28 | Re : Javascript => Onglets intérefrences ?!

PetoleTeam

Membre Club
Bonjour,
de temps à autre on se plaint de ne rien avoir et là on en a trop => pas tout lu le code...juste fait un tour sur le lien.

Le constat est que les onglets ne disparaissent pas mais sont décalés vers le bas.

pourquoi ne pas mettre tout ce qui doit apparaître dans le même conteneur, et sous la deuxième ligne de préférence, de la sorte tes onglets resteraient groupés...

;O)
vendredi 2 avril 2010 à 13:22:31 | Re : Javascript => Onglets intérefrences ?!

Jobs68
je veux 2 blocs bien distincts c est pour ça que je peux pas tout mettre ensemble... Et le problème c'est que si je met du contenu dans les onglets du bas mis à part le 1er bah ya rien qui apparait...

Merci de ton aide ;)
vendredi 2 avril 2010 à 15:44:06 | Re : Javascript => Onglets intérefrences ?!

PetoleTeam

Membre Club
j'aurais tendance à dire mauvaise conception...
Il te reste une solution c'est d'avoir la possibilité d'étendre ou de contracter l'onglet, mais vue ce que te désires faire pas sur que cela soit un bon choix.

;O)
vendredi 2 avril 2010 à 18:27:01 | Re : Javascript => Onglets intérefrences ?!

Jobs68
Je me promenait sur différents forums pour chercher si quelqu'un avait quelque chose de semblable et je suis tombé ici :

Forum

Je me demandais comment eux ont fait car c'est exactement ce que je cherchais :S
vendredi 2 avril 2010 à 20:03:35 | Re : Javascript => Onglets intérefrences ?!

PetoleTeam

Membre Club
tu as toujours la possibilité de leur demander mais perso je ne vois pas de différence entre vos deux approche si ce n'est que leur site pour chaque onglet à du texte qui fait que tu ne vois pas la deuxième ligne d'onglet.

;O)
vendredi 2 avril 2010 à 22:35:38 | Re : Javascript => Onglets intérefrences ?!

Jobs68
Oui ça je l'ai bien vu seulement chez eux si tu prend un onglet du bas et que tu remonte les onglets du haut y sont toujours et tu peux tester n'importe quel ensembles d'onglets (haut et bas) il n'y a pas de bugs alors que chez moi sur certains onglets ya tout qui plante... Et comme je l'ai dit plus haut je n'arrive pas à mettre de contenu dans le 2ème et 3ème onglet de la 2ème ligne alors que pour la 1ère aucun soucis...

Merci encore de ton aide
samedi 3 avril 2010 à 08:19:42 | Re : Javascript => Onglets intérefrences ?!

PetoleTeam

Membre Club
Bonjour,j'ai pris le temps de regarder un ton code HTML et JS et la alors qu'elle surprise c'est loin d'être clean, coté lisibilité et autres structuration.
Par jeu je l'ai passé à la moulinette des validateurs et tu à même réussi à plater VALIDOME alors que VALIDATOR annonce pas moins de 68 Errors.

Ceci mise à part
Tu as deux fonctions change_onglet identique, seule la deuxième rencontrée sera prise en compte, tu peux donc en supprimer une...sauf que comme tu gères les deux séries d'onglets à part il te faut au pire deux fonctions différentes pour afficher/cacher les textes des onglets.

Conseils :
met la partie style dans un fichier à part que tu incluras avec
<link type="text/css" rel="STYLESHEET" href="fichier.css">

regroupes tes script parsemés tout au long de ta page en fin de document, éventuellement, la lisibilité et la maintenance n'en sera que meilleure.
Il y aurait encore de quoi dire, mais je pense que la correction de ces erreurs devrait t'aider à te rapprocher de la solution.

Aller je cours prendre une ASPIRINE.
;O)
samedi 3 avril 2010 à 08:48:09 | Re : Javascript => Onglets intérefrences ?!

Jobs68
Merci pour ton aide donc si j'ai bien compris il faut simplement que je change le nom de ma 2ème fonction d'onglets ?
Pour le reste je ne peux pas énormément modifié le tout car je suis sous forumactif en phpbb2, modulable mais pas à 100% ;)
dimanche 4 avril 2010 à 11:26:40 | Re : Javascript => Onglets intérefrences ?!

Jobs68
Pourrais-tu me dire ce que je dois renommer car j'ai un peu de mal là ^^

1 2

Cette discussion est classée dans : border, margin, 0px, moz, radius

Répondre à ce message

Sujets en rapport avec ce message

-moz-border-radius: [ par mouness ] svp quelqu'un serait comment faire un -moz-border-radius: sur un tableau qui marche avec IE (ca fonctionne sur firefox mais pas IE) merci d'avance Le background ne s'affiche pas sous IE7 [ par 311064 ] BonjourJ'ai des soucis avec l'affichage du background sous IE7.Il fonctionne bien sous Firefoxe mais sous IE7 l'image de fond de la page ne s'affiche Garder ouvert un menu accordeon [ par AlexFaitDesChoses ] Bonjour à tous, je débute en PHP et j'aimerais quelques conseils. Je suis entrain de créer mon nouveau site qui se compose comme ceci: un menu déroula pb compatibilité explorer [ par Bestdoud ] Bonjour,J'ai fait cette page web:http://amigagaamp.free.fr/index2.htmCa fonctionne très bien sous IE mais pas sous firefox et j'ai pas esséy les autre [CSS ] mon background-attachment fonctionne uniquement sur IE [ par attentio ] Bonjour,  j'ai une image de fond qui est centrée mais je voudrais que lorsque la fenetre du navigateur est plus petite que mon tableau principale alor chgt de style suivant la resolution ? [ par seabird ] Salut, J'ai optimisé mes pages pour un affichage en 1024x 768.J'ai donc rajouté un div pour la centrer si éventuellement la résolution est plus grande Probleme affichage menu sur IE9 (css) [ par ju0123456789 ] Bonjour, Je suis en train de dev un petit site vitrine, tout se passe bien pour le moment, sauf une chose, j'ai l'image de fond de mon menu (quand on lien clignotant spéciaux [ par astuces_jeux ] bonjour je cherche comment faire pour fair des comme quand on est connecter sur codes source il y a fiche profil etc au dessus quand tu met le curseur Drag and drop [ par boulika ] BonjourVoici le code source d'une page en javascript avec des "div" a drager . Je ne sais pas comment faire pour soit :- obtenir les coordonnées des d dipaporama et firefox [ par nickg ] bonjour j'ai un diaporama tout simple. Dans une page, j'ai un tableau dans une iframe dans laquelle s'affiche des vignettes dans la cellule de droite.


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

Photo Waterfall in Kauai Hawaii With RainbowPhoto Beautiful El Capitan Yosemite National Park
Photo Sea sponges and water surface 

Visiter la photothèque

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,451 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)