gestire altezza div

[matteo01]

Salve a tutti. In un sito che sto realizzando sto cercando di gestire l'altezza di alcuni div con questo codice:

function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.height=="100px"){
e.style.height="auto"
} else {
e.style.height="100px"
}
return true;
}

<div id="para2" style="overflow:hidden;height:100px">
                     <h2>Titolo</h2>

Questo codice funziona alla perfezione, il problema è che, essendo specificata l'altezza iniziale via css, in caso di javascript disabilitato il visitatore non potrà mai vedere l'intero contenuto del box...

é possibile specificare anche l'altezza iniziale via javascript, cosi che se il visitatore non avrà javascript vedrà tutti i box espansi?
Grazie!!

[deleted_110]

Originariamente inviato da matteo01
é possibile specificare anche l'altezza iniziale via javascript, cosi che se il visitatore non avrà javascript vedrà tutti i box espansi?
Grazie!!

:master: Ma se js e' disabilitato.. sara' disabilitato anche lo script che setta l'altezza iniziale :master:

Forse cio' che intendi e' questo

1 - Impostare i css con altezza ad auto in modo che se js e' disabilitato il div sia espanso
2 - Se js e' abilitato cambiare i css al volo per rimpicciolire il div all'apertura della pagina
3 - Con apposito tasto js nascondere/espandere il div

se e' cosi' allora modifica i css e aggiungi

onload = function() {
toggleMe("para2");
}

al tuo script

[matteo01]

Hai capito perfettamente! solamente una cosa, siccome associo quel javascript a diversi div (para1, para2,para3 ecc ecc), come posso fare per specificare nel codice che mi hai dato tutta la lista di ID?

Grazie mille!!

[deleted_110]

se non sono mille puoi semplicemente mettere una riga per ogni div

onload = function() {
    toggleMe("para2");
    toggleMe("para3");
    toggleMe("para4");
   eccetera...
}

Oppure metti gli id in un array e lo scorri

oppure se sono tutti da "para1" a, ad esempio, "para100" fai un ciclo for

[matteo01]

sono una decina...sinceramente io a javascript son zero...dici che la soluzione da te suggerita per 10 id può andar bene? altrimenti pretendo troppo se ti chiedo di scrivermi questo array?
Grazie ancora!

[deleted_110]

Beh, se sono una decina puoi anche ripetere le righe, non sara' elegante ma non cambia molto. Comunque giusto per fare:

onload = function() {
    divs = new Array("para1", "pippo", "pluto" qui ci metti gli id dei tuoi div separati da virgola);
    for (var i=0; i<divs.length; i++)
    {
        toggleMe(divs[i]);
    }
}

oppure se tutti i nomi sono del tipo "para" + numero. Con numero che va da uno a 10

onload = function() {
    for (var i=1; i<=10; i++)
    {
        toggleMe("para" + i);
    }
}

[matteo01]

Perfetto!!!! Grazie tante!!!!

[matteo01]

e ti pareva...era troppo semplice!!
Purtroppo ho un'altro problema, nel momento in cui si seleziona il link per espandere il div, se si è scrollata la pagina, essa torna in alto. non so se mi sono spiegato...se si..si può evitare? Credo serva qualcosa tipo un return false, ma ho provato senza risolver niente!

[matteo01]

risolto cosi...può andare? (per funzionare funziona, ma chissà)

function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.height=="100px"){
e.style.height="auto";return false
} else {
e.style.height="100px";return false
}
return true;
}
onload = function() {
    divs = new Array("para1", "para2", "para3", "para4", "para5");
    for (var i=0; i<divs.length; i++)
    {
        toggleMe(divs[i]);
    }
}

[deleted_110]

e' proprio return false invece

mettilo al posto di return true nella funzione

dovrebbe bastare

edit: ecco appunto