iframe shimming o ie6 (e sotto) seleziona z-index bug

Question

Uhm, non sono sicuro che qualcuno abbia riscontrato questo problema
una breve descrizione è su IE6 tutti gli <select> oggetti vengono visualizzati su qualsiasi altro elemento, anche quello di div ... il che significa che se hai un effetto javascript di fantasia che mostra un div che dovrebbe essere in cima a tutto (ad esempio: lightbox, multibox ecc. ..) il clic di un certo elemento e quel div si sovrappone a <=> i div div vengono visualizzati come se si trovasse sotto <=> [in questo caso un indice z massimo e minimo non funziona]

Ho provato a cercare su Google e ho trovato la soluzione shim iframe
ma volevo delle alternative piuttosto pulite o meglio qualcuno ha trovato una soluzione migliore? poiché il metodo che utilizza iframe utilizza circa 130 MB di RAM potrebbe rallentare le macchine dei poveri

Answer 1

Non è necessario nascondere ogni select utilizzando un ciclo. Tutto ciò che serve è una regola CSS come:

* html .hideSelects select { visibility: hidden; }

E il seguente JavaScript:

//hide:
document.body.className +=' hideSelects'

//show:
document.body.className = document.body.className.replace(' hideSelects', '');

(Oppure puoi usare la tua addClass / removeClass implementazione preferita).

Answer 2

Esiste un plug-in per jquery chiamato bgiframe che semplifica l'implementazione del metodo iframe .

Personalmente, come sviluppatore web, sono al punto in cui non mi interessa più l'esperienza utente in IE6. Lo renderò il più vicino a & Quot; corretto & Quot; il più possibile e assicurati che sia funzionale, ma per quanto riguarda la velocità, peccato. Possono aggiornare. IE7 (anche se ancora abbastanza lento, rispetto a tutti gli altri browser) è stato fuori per 2 anni (quasi al giorno!). IE8 uscirà a breve. Firefox è disponibile per ogni piattaforma. Safari è anche un'opzione (e super veloce). Opera è disponibile per la maggior parte / ogni piattaforma.

IE6 è stato rilasciato oltre 7 anni fa. IMHO, non c'è motivo di usarlo ancora, a parte gli utenti pigri e i dipartimenti IT incompetenti (o se sei uno sviluppatore web).

Answer 3

se qualcuno è interessato, ecco un po 'di codice IE shimming.

* html .shimmed {
    _azimuth: expression(
        this.shimmed = this.shimmed || 'shimmed:'+this.insertAdjacentHTML('beforeBegin','<iframe style="filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);position:absolute;top:0px;left:0px;width:100%;height:100%" frameBorder=0 scrolling=no src="javascript:false;document.write('+"''"+');"></iframe>'),
        'inherit');
}

ref: questa idea di subtleGradient e questo post di Zach Leatherman

Answer 4

Prima di IE7 l'elenco a discesa era un " con finestra " controllo significa che è stato reso come controllo direttamente da Windows piuttosto che dal browser che lo sintetizza. Pertanto, non è stato possibile supportare l'indicizzazione z rispetto ad altri controlli sintetizzati.

Per apparire su un DDL, è necessario utilizzare un altro controllo con finestre, come IFRAME. Puoi anche usare una funzionalità solo nota di IE chiamata window.createPopup () che essenzialmente crea un popup senza cromatura. Presenta limitazioni, come l'inarrestabile click-out, ma in realtà sono un po 'utili se stai costruendo un sistema di menu al passaggio del mouse.

Answer 5

La soluzione più semplice ed elegante a quel fastidioso bug di IE si trova su: http: // docs. jquery.com/Plugins/bgiframe utilizzando jQuery.

Ho raggiunto questa conclusione dopo aver provato per 2 giorni a farlo funzionare con WebSphere Portal / Portal Applications dove tutto è dinamico, incluso il menu a comparsa.

Answer 6

C'è anche il metodo activex, che sto iniziando a esplorare. Richiede la creazione di un codice condizionale per utilizzare un controllo activex invece di una casella di selezione per ie6. C'è un script demo che mostra la tecnica, che è discusso in modo più dettagliato qui .

Aggiornamento: sembra che MS Office sia necessario per il controllo active-x sul computer dell'utente. In teoria, potrebbe essere possibile includerlo da qualche parte, in qualche modo, ma sta diventando molto più disordinato.

Answer 7

So che molte persone hanno suggerito i propri suggerimenti, ma nel mio caso, nascondo semplicemente select usando jquery come il seguente.

$(':date').dateinput({
    format: 'dd/mm/yyyy',
    onBeforeShow: function(event) {
        $('select').hide();
    },
    onHide: function(event) {
        $('select').show();
    }
});