Bonjour tout le monde,
EDIT1 : Tout d'abord je ne parviens pas à clairement appliquer les style liés au langage, désolé.
EDIT 2 : C'est bon, j'ai trouvé
Je débute en Javascript et je me suis fait tout seul comme un grand une boîte à onglets. La mauvaise surprise ça a été lorsque j'ai chargé la page sous IE.. La cata. Sous FF, Opera et Chrome ça marche correctement en revanche. Voyez vous-mêmes : http://aeroport.calais.free.fr/pronos/test.php
J'ai mis le problème en CSS mais il semblerait qu'il y ait 2 soucis sous IE :
1- le script ne s'exécute pas normalement, le clic sur un nouvel onglet n'a pas l'effet escompté
2- la mise en page est complètement foireuse sous IE
Voici les 3 bouts :
Javascript
L'appel :
Et la css :
Quelqu'un peut-il m'aider svp ? Merci d'avance.
Modifié par Bertrand40 (10 Feb 2010 - 11:57)
EDIT1 : Tout d'abord je ne parviens pas à clairement appliquer les style liés au langage, désolé.
EDIT 2 : C'est bon, j'ai trouvé
Je débute en Javascript et je me suis fait tout seul comme un grand une boîte à onglets. La mauvaise surprise ça a été lorsque j'ai chargé la page sous IE.. La cata. Sous FF, Opera et Chrome ça marche correctement en revanche. Voyez vous-mêmes : http://aeroport.calais.free.fr/pronos/test.php
J'ai mis le problème en CSS mais il semblerait qu'il y ait 2 soucis sous IE :
1- le script ne s'exécute pas normalement, le clic sur un nouvel onglet n'a pas l'effet escompté
2- la mise en page est complètement foireuse sous IE
Voici les 3 bouts :
Javascript
function afficheronglet(n)
{
var etat = document.getElementsByName("onglet");
var fond = document.getElementsByName("puce");
var nbre = etat.length;
for (j = 0; j < nbre; j++)
{
if (etat[n].style.display != etat[j].style.display)
{
etat[n].style.display = "block";
fond[n].style.background = "yellow";
etat[j].style.display = "none";
fond[j].style.background = "none";
}
}
}
L'appel :
<script type="text/javascript" src="scripts.js"></script>
<div id="contenant">
<dl>
<dt name="puce" style="background: yellow;">
<!-- onglet 1 : n = 0 -->
<a href="#" onclick="javascript:afficheronglet(0)">But et gains</a>
<div id="onglet" style="display: block; " name="onglet">
<p>On ne joue ici que sur la course (pas de paris pour les qualifications). Le but est de <strong>parier sur les 10 premiers pilotes à l'arrivée de chaque weekend de grand-prix</strong>. Au terme du grand prix, le pronostic rapporte des points (cf juste en dessous) et un cumul de points se fait
tout au long de la saison. Au terme de la saison un vainqueur sera désigné.</p>
</div>
</dt>
<dt>....
</dl>
</div>
Et la css :
#contenant
{
margin: 0;
width: 100%;
height: auto;
}
#onglet
{
position: absolute;
width: 780px;
padding: 0;
}
#contenant dl
{
border-bottom: 1px solid;
width: 100%;
height: 22px;
}
#contenant dt
{
display: inline;
list-style-type: none;
margin: 0 3px 0 0;
padding: 3px;
border: 1px solid;
border-bottom: 0;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
}
Quelqu'un peut-il m'aider svp ? Merci d'avance.
Modifié par Bertrand40 (10 Feb 2010 - 11:57)