Modificare stile div

[GianlucaB]

Salve, tempo addietro avevo creato un codice funzionate perchè provato.
Tale codice permetteva di modificare lo stile di 2 div in base alla risoluzione dello schermo.

Il codice da me creato, funzionante è questo:

<script language="javascript">

function ridimensiona() {
      document.getElementById('Intestazione3').style.width = "850px";
      document.getElementById('BannerVideo').style.marginLeft = "350px";
      document.getElementById('BannerVideo').style.marginTop = "1px";     
}
 var larghezza = window.screen.width;
 if  (larghezza<1024) {
ridimensiona();
}
</script>

In pratica il codice modifica le dimensioni dei 2 div se la larghezza schermo è inferiore a 1024.

Il codice quando lo provai funzionava, poi l'ho messo da parte, oggi lo vado a riprendere e non funziona più.

Ho fatto un pò di prove, la rilevazione della larghezza funziona, quello che non funziona più è propio l'istruzione
document.getElementById

A forza di prove sono arrivato a scrivere questa riga di codice

<script type="text/javascript">

  document.getElementById("Intestazione3").style.display="none";

</script>

Che in pratica dovrebbe nascondere il div Intestazione3, ma nulla non funziona proprio.

Cosa cavolo è successo?
Perchè non mi funziona più nemmeno quella semplice riga di codice?

Stò impazzendo, qualcuno è in grado di aiutarmi...

Grazie.

[Tonenge]

Ciao,
a prima vista sembrerebbe che esegui lo script prima di aver caricato il body con i div... ma non ho abbastanza elementi per verificare.

Saluti

[GianlucaB]

Grazie per la risposta.

Ecco dove era l'inghippo, effettivamente caricavo il codice prima di creare i vari div.

Però io vorrei fare proprio quello, ovvero stabilire lo stile, e poi caricare il div, perchè ovviamente il div deve apparire subito come io ho stabilito, e non venir modificato dopo.

Talvolta causa banner pubblicitari, la pagina impiega anche un paio di secondi a completare il caricamento, e questo causa il problema dei div caricati con stili diversi da come dovrebbero comparire, per poi venir sistemati dopo.

C'è una soluzione a questo?

[cavicchiandrea]

Grazie per la risposta.

Ecco dove era l'inghippo, effettivamente caricavo il codice prima di creare i vari div.

Però io vorrei fare proprio quello, ovvero stabilire lo stile, e poi caricare il div, perchè ovviamente il div deve apparire subito come io ho stabilito, e non venir modificato dopo.

Talvolta causa banner pubblicitari, la pagina impiega anche un paio di secondi a completare il caricamento, e questo causa il problema dei div caricati con stili diversi da come dovrebbero comparire, per poi venir sistemati dopo.

C'è una soluzione a questo?

Sposta il blocco di script

< script language="javascript">

 function ridimensiona() {
       document.getElementById('Intestazione3').style.width = "850px";
       document.getElementById('BannerVideo').style.marginLeft = "350px";
       document.getElementById('BannerVideo').style.marginTop = "1px";     
 }
  var larghezza = window.screen.width;
  if  (larghezza<1024) {
 ridimensiona();
 }
< /script>

subito prima della chiusura del body

[GianlucaB]

Si è quello che ho fatto, adesso il codice funziona, ma subentra il problema di cui sopra.
Ovvero prima vengono caricati i div di dimensioni e stile come da foglio di stile, e dopo vengono modificati, ma il dopo delle volte avviene anche dopo 2-3 secondi, con il risultato che compare subito una pagina sconquassata per sistemarsi dopo tot secondi.

Per quello pensavo di poter attribuire lo stile ai div prima di crearli e quindi farli apparire.

[WottaFacca]

E se invece di mettere il codice prima della chiusura del BODY lo inserissi subito dopo l'apertura di quest'ultimo?

La macchina dovrebbe prima leggere lo script e quindi assegnare le dimensioni corrette una volta che trova il div

[cavicchiandrea]

Si è quello che ho fatto, adesso il codice funziona, ma subentra il problema di cui sopra.
Ovvero prima vengono caricati i div di dimensioni e stile come da foglio di stile, e dopo vengono modificati, ma il dopo delle volte avviene anche dopo 2-3 secondi, con il risultato che compare subito una pagina sconquassata per sistemarsi dopo tot secondi.

Per quello pensavo di poter attribuire lo stile ai div prima di crearli e quindi farli apparire.

Se non l'hai già provato racchiudi lo script nel evento onload di window, se anche cosi non funziona (o peggiora come immagino) dovrai eseguire un preload di pagina.

E se invece di mettere il codice prima della chiusura del BODY lo inserissi subito dopo l'apertura di quest'ultimo?

La macchina dovrebbe prima leggere lo script e quindi assegnare le dimensioni corrette una volta che trova il div

Se lo mette subito dopo l'apertura del body quando viene eseguito lo script (senza evento onload) cerca degli oggetti del documento che non esisto è va in errore

[cassano]

E se usa il document.ready di Jquery ?

[cavicchiandrea]

E se usa il document.ready di Jquery ?

non cambia nulla ready è l'equivalente di onload, se vuoi provare con jquery testerei load

1 2 3

$( window ).load(function() { // Run code });

[Vindav]

con load di jquery è anche peggio perche prima che venga eseguito lo script deve essere caricata anche tutte la parte grafica (oltre al DOM). L'unica cosa che si può fare, se si vuole usare javascript, è quella di piazzare lo script subito dopo il div. Meglio ancora è non utilizzare javascript ma css e le media query.