Come abilitare le funzionalità CSS3 in Internet Explorer 6, 7 e 8?


18

Mentre IE9 sembra molto promettente, IE6, IE7 e IE8 probabilmente ci perseguiteranno per molti anni a venire, rallentando la diffusione di CSS3 sul web.

Numerosi progetti basati su HTC e JS aggiungono un supporto CSS3 a IE:

  • CSS3PIE
  • IE7.js
  • eCSStender
  • DD_roundies
  • border-radius.htc (angolo curvo)
  • ie-css3.htc
  • cioè-css3.js

Ho solo esperienza con CSS3PIE (facendo le cose arrotondate su http://docs.composite.net/ ) e, fatta eccezione per gli effetti mouse over, funziona bene ed è puro CSS3.

Quali funzionalità CSS3 apportano i diversi progetti a IE e quanto bene? Qualcuno di loro è un chiaro vincitore?


1
Perché non provarli tutti e facci sapere cosa trovi? Se hai un blog sarebbe un bel post che genererebbe molto interesse, ne sono sicuro.
John Conde

Ho trovato questo sul sito CSS3PIE css3pie.com/documentation/product-comparison ma mi aspetterei che fosse di parte, quindi la domanda. Richiede un po 'di esperienza nel mondo reale per avere una buona sensazione.
Mawtex,

Risposte:


8

Dal momento che nessuno ha ancora intensificato, proverò a dare una risposta a questo. È principalmente raccolto leggendo http://css3pie.com/documentation/product-comparison/ e facendo ricerche su Google. Ho solo esperienza pratica con CSS3PIE. Se conosci qualcuno degli altri progetti, sentiti libero di modificarlo

CSS3PIE di Jason Johnston Aggiunge un buon supporto per Css3 border-radius, gradients, box-shadow. La mia esperienza con questo è che funziona abbastanza bene e ha un ottimo supporto per border-radius. Problematico per gli effetti al passaggio del mouse (mi aspetto che tutti gli elementi in questo elenco ne soffrano) ma sembrano impeccabili se usati su HTML statico. Maggiori informazioni su http://css3pie.com/

ie-css3.js di Keith Clark Aggiunge il supporto per molti selettori di pseudo-classe CSS3. È estremamente piccolo poiché si nutre di altre librerie js che includi, come jQuery. Questo potrebbe funzionare bene con altri progetti in questo elenco come CSS3PIE. Maggiori informazioni su http://www.keithclark.co.uk/labs/ie-css3/
UPDATE Il progetto ie-css.js è rinato qui: http://selectivizr.com/

IE9.js di Dean Edwards Funziona per IE6, 7 e 8. Rendi IE compatibile con PNG trasparente, nuovi selettori CSS come parent> child e: primo di tipo, posizionamento fisso, supporto larghezza / altezza max / min. La mia impressione è che ci sia stato molto lavoro in questi anni. Alcune recensioni sono davvero positive, altre sprezzanti. Maggiori informazioni su http://code.google.com/p/ie7-js/

ecsstender di Aaron Gustafson Funziona con IE6, 7 e 8. In un modo modulare aggiunge il supporto per selettori CSS3, font-face, border-radius, box-shadow, colori e trasformazioni. Molto ben documentato Maggiori informazioni su http://ecsstender.org/extensions

DD_roundies di Drew Diller Aggiunge un po 'di supporto per border-radius e png. Maggiori informazioni su http://www.dillerdesign.com/experiment/DD_roundies/

border-radius.htc di Remiz Rahnas Supporto molto semplice per border-radius. Maggiori informazioni su http://code.google.com/p/curved-corner/

ie-css3.htc di Nick Fetchak Alcuni supporti per border-radius e text-shadow. CSS3PIE afferma di migliorare il raggio del confine. Maggiori informazioni su http://www.fetchak.com/ie-css3/


3

Ecco un bell'articolo riguardante CSS3 e IE6, dalla rivista Smashing: http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/


3
Questo articolo è un'ottima introduzione a "border-radius.htc" ma per la maggior parte è un elenco di filtri CSS solo IE che possono imitare le funzionalità CSS3. Come sviluppatore web vorrei non scrivere molto del vecchio codice CSS specifico di IE, ma concentrarmi su CSS standard e far reagire IE a questo, come fanno "border-radius.htc" e "CSS3PIE".
mawtex,

0

Prova Google Chrome Frame . Gli utenti di IE che lo installano potranno navigare nel tuo sito nel renderer di Google Chrome senza cambiare browser.

MODIFICA: puoi persino utilizzare una libreria JS fornita da Google per mostrare un messaggio agli utenti che li invitano a installare Google Chrome Frame. È un'installazione con un clic, come Flash, non richiede il riavvio del browser e aggiorna la pagina al termine.


Quindi, il tuo suggerimento è fondamentalmente di contattare in qualche modo tutte le persone che visiteranno il sito del poster della domanda in futuro con IE6 / 7/8 e far loro installare Google Chrome Frame prima che visitino? non sarebbe più semplice far passare a Chrome tutti gli utenti IE del mondo?
Nir

@Nir Ho modificato per spiegare come è possibile convincere i tuoi utenti a installare GCF utilizzando la libreria JS di Google. È abbastanza carino
Dan Fabulich,

anche con installazioni con un clic (BTW, su Vista è necessario Ok 5 avvisi di sicurezza per installare Flash - tanto per un clic) Non mi sognerei di chiedere ai miei utenti di installare un plug-in del browser solo così posso usare gli angoli arrotondati (e Ho il sospetto che gli unici che installeranno sono quelli che si fidano davvero e che apprezzano il mio prodotto - cioè quelli che compreranno anche senza gli angoli arrotondati).
Nir
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.