Je crois rencontrer un problème avec le code, le premier onglet est transparent (?) et laisse visible affichage 2 sur affichage 1:
Si je met ça dans la page
<div id="iframe">
<div id="imenu">
<a id="imenunews" href="javascript:showNews();">Affichage 1</a>
<a id="imenuresult" href="javascript:showResults();">Affichage 2</a>
</div>
<div id="icontenu">
<span id="inews">
Affichage 1
</span>
<span id="result">
Affichage 2
</span>
</div>
</div>
ça dans le CSS
#iframe {
float: left;
margin-top: 20px;
margin-left: 20px;
_margin-left: 10px; /* Crack IE */
margin-bottom: 0px;
width: 230px;
height: 223px;
}
#imenu {
width: 230px;
height: 18px;
background: url('img/imenu.jpg');
background-repeat: no-repeat;
}
a#imenunews {
float: left;
font-size: 0.8em;
margin-left: 20px;
color: #F7EFCD;
text-decoration: none;
}
a:hover#imenunews {
color: #EEAB7B;
text-decoration: none;
}
a#imenuresult {
float: right;
font-size: 0.8em;
margin-right: 25px;
color: #8E6F43;
text-decoration: none;
}
a:hover#imenuresult {
color: #EEAB7B;
text-decoration: none;
}
#icontenu {
font-size: 0.6em;
text-align: justify;
overflow: auto;
width: 220px;
_width: 230px; /* Crack IE */
height: 205px;
padding: 5px;
background: #F8F4E3;
border: 1px solid #B49870;
}
a.ilien {
color: #8E6F43;
text-decoration: none;
}
a:hover.ilien {
color: #EEAB7B;
text-decoration: none;
}
Et ça dans le JS
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.sous_menu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("menu_deroulant").getElementsByTagName("span");
if(el.style.display != "block"){
for (var i=0; i<ar.length; i++){
if (ar[i].className=="sous_menu")
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.sous_menu2{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("menu_deroulant2").getElementsByTagName("span");
if(el.style.display != "block"){
for (var i=0; i<ar.length; i++){
if (ar[i].className=="sous_menu2")
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_jumpMenuGo(selName,targ,restore){ //v3.0
var selObj = MM_findObj(selName); if (selObj) MM_jumpMenu(targ,selObj,restore);
}
[/i][/i][/i][/i][/i][/i]