• User Newbie

    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 quel

    divs*.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!!


  • User Attivo

    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;

    :ciauz:
    *


  • User Newbie

    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!


  • User Attivo

    L'ho provato e... boh, io vedo tutti gli input sia con FF che con IE :mmm:


  • User Newbie

    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?


  • User Attivo

    @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.

    :ciauz:


  • User Newbie

    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


  • User Attivo

    @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
    Ciao

    Meglio così 😄

    Ciao! :ciauz: