mercoledì 3 ottobre 2007

Aggiornamento Menu Javascript (QMenu)

Mi è stato fatto notare che QMenu, il menu a tendina in Javascript presentato in questo articolo, presenta dei problemi quando viene usato in una pagina che non contiene un DOCTYPE valido visualizzata da Internet Explorer.

Questo succede perché Internet Explorer utilizza il cosiddetto quirks mode per visualizzare un documento html/xhtml privo di DOCTYPE. Le conseguenze, per quello che interessa il nostro script e senza voler approfondire più di tanto, sono che i tag DIV che compongono gli elementi del menu sono dimensionati e posizionati in modo leggermente diverso rispetto a quanto avviene negli altri browser (e nello stesso Internet Explorer in standard mode, cioè in presenza di un DOCTYPE valido nel documento).

Tutto questo causa degli antiestetici spazi vuoti tra i vari elementi del menu.

La soluzione sarebbe quella di utilizzare sempre un DOCTYPE valido per i propri documenti html/xhtml ed evitare del tutto le problematiche relative al quirks mode. Però è vero che ci sono siti web che, per ignoranza del web designer o perché molto vecchi, sono stati creati assumendo che il quirks mode fosse l'unica modalità di visualizzazione.

In questi casi casi aggiungere un DOCTYPE e forzare lo standard mode può produrre errori di visualizzazione delle pagine in Internet Explorer.

L'unica possibilità è quindi quella di modificare lo script in modo che si adatti alle diverse modalità di visualizzazione. Ed è quello che ho fatto anche perché se no questa lunga introduzione servirebbe a ben poco.

Individuare il 'quirks mode' in Javascript

Per individuare se il documento viene visualizzato dal browser in quirks mode si usa la proprietà compatMode dell'oggetto document in questo modo

if(document.compatMode=='BackCompat') {
 //siamo in quirks mode
}

Cosa faccia lo script in questa situazione lo lascio scoprire, chiaramente a chi interessa, controllando il sorgente. Non è niente di difficile, solo semplici aggiustamenti per correggere la posizione degli elementi del menu quando la modalità di visualizzazione è quirks mode e il browser è Internet Explorer.

La versione modificata (1.01) di QMenu è scaricabile dal sito.

Ho cercato di provare bene la modifica su tutte le versioni dei browser su cui ho potuto mettere le mani, fatemi sapere se incontrate problemi.

Nessun commento:

Posta un commento

Nota. Solo i membri di questo blog possono postare un commento.