- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Problema di visualizz div in IE
-
Problema di visualizz div in IE
Ciao a tutti!!
Mi sto battendo con un problema di visualizzazione.
Posto una parte del codice, cmq funzionante.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function radio_click()
{var divs = document.getElementsByTagName('div');
for(var i = 0; i < divs.length; i ++ )
{
divs*.style.visibility = "hidden";
divs*.style.top = "-1000px";
divs*.style.position = "absolute";
// alert("Fine");
}if (document.getElementById('text_radio').checked)
{document.getElementById('sin_text_lev').style.visibility = "visible";
document.getElementById('sin_text_lev').style.top = "0px";
document.getElementById('sin_text_lev').style.position = "relative";
return;
}if (document.getElementById('file_radio').checked)
{
document.getElementById('mul_file_lev').style.top = "0px";
document.getElementById('mul_file_lev').style.position = "relative";
document.getElementById('mul_file_lev').style.visibility = "visible";
return;
}if (document.getElementById('bool_radio').checked)
{document.getElementById('bool_lev').style.top = "0px";
document.getElementById('bool_lev').style.position = "relative";
document.getElementById('bool_lev').style.visibility = "visible";
return;
}
}
</script>
</head><body>
<form name="form1" method="post" action="xaaa">
<table width="900" border="1" style="width: 900px; height: 100px; background-color: antiquewhite;">
<tr>
<td>
<label>
<input type="radio" name="arg_type" value="text" id="text_radio" onClick="radio_click()" checked="checked"/>
text</label>
<br>
<label>
<input type="radio" name="arg_type" value="file" id="file_radio" onClick="radio_click()">
file</label>
<br>
<label>
<input type="radio" name="arg_type" value="boolean" id="bool_radio" onClick="radio_click()">
boolean</label>
<br></td>
<td>
<div id="sin_text_lev" style="position:relative; z-index:1; top: 0px; visibility: visible;">
<p align="center">Default Value</p>
<p align="center"><input type="text" name="textfield3" id="sin_text" style=""></p>
</div><div id="mul_file_lev" style="position:absolute; z-index:1; top: -1000px; visibility: hidden;">
<p align="center">Default Value</p>
<p align="center">
<input type="text" name="textfield2" id="mul_text"></p>
<p align="center">
<input name="Add" type="button" id="Add1" value="+" onClick="add_res('mul_text')">
</p>
<p align="center">
<textarea name="textarea" id="mul_text_area"></textarea>
</p>
<br>
</div><div id="bool_lev" style="position:absolute; top: -1000px; z-index:1; visibility: hidden;">
<p align="center">Default Value</p>
<p align="center">
<input type="file" name="file" id="mul_file"></p>
<p align="center">
<input name="Add" type="button" id="Add2" value="+" onClick="add_res('mul_file')" align="middle">
</p>
<p align="center">
<textarea name="textarea2" id="mul_file_area"></textarea>
</p>
</div></td>
</form>
</body></html>
Con Firefox nessun problema.
Con Internet Explorer, invece, scompaiono le caselle di input. E la cosa strana è ke, invece, le label rimangono correttamente al loro posto!!!!!!
Il prob è in queldivs*.style.position = "absolute";
nella funzione. Sembra ke gli "input" ereditino quel valore e poi nn c'è modo di farlo tornare relative!
E allora, perchè nn levarlo? Provate a commentarlo e vedete ke succede (sia con Firefox, sia con IE)!
AIUTOOO!!
Grazie lo stesso,cmq!!
-
Sembra ke gli "input" ereditino quel valore e poi nn c'è modo di farlo tornare relative!
Non ho tempo di provare il codice, però se il problema è l'ereditarietà dell'attributo position, puoi provare a dare ai tuoi imput un *position: relative !important;
*
-
Già provato. Non cambia nulla!
Anke impostando a mano le 3 proprietà di stile: position, top e visible x gli input elements il risultato è sempre ke nn si vedono!
-
L'ho provato e... boh, io vedo tutti gli input sia con FF che con IE
-
Davvero? e perkè a me nn funzia? ma tu usi IE7? forse hai il 6?
E poi. X fare quello ke voglio fare, secondo te, sto seguendo la strada migliore (o almeno non la peggiore)? Sarebbe meglio utilizzare i CSS?
-
@Poldo said:
Davvero? e perkè a me nn funzia? ma tu usi IE7? forse hai il 6?
E poi. X fare quello ke voglio fare, secondo te, sto seguendo la strada migliore (o almeno non la peggiore)? Sarebbe meglio utilizzare i CSS?Uso il 6.
Non so bene cosa vuoi fare. Leggendo il codice mi sembra di capire che a seconda degli input del tuo form, tramite js la pagina cambi la posizione dei div, mostrandone sempre uno alla volta... sbaglio?
Puoi provare con qualche libreria js che ti permetta di usare qualche tecnica di accordion. Mi sembra di aver visto un esempio simile fatto con le moo fx, in cui le div dopo il collapse scomparivano.
-
Ho risolto levando tutte le proprietà di stile e usando solo display:none o display:block.
Era così semplice e c'ho xso giornate!!
Grazie cmq
Ciao
-
@Poldo said:
Ho risolto levando tutte le proprietà di stile e usando solo display:none o display:block.
Era così semplice e c'ho xso giornate!!
Grazie cmq
CiaoMeglio così
Ciao!