Leggi un file CSS con Javascript e modifica dinamicamente la pagina

Quindi le query CSS @media non funzionano in IE8.Leggi un file CSS con Javascript e modifica dinamicamente la pagina

@media (min-width: 768px) { 
/* some css */ 
} 
@media (min-width: 972px) and (max-width: 1024px){ 
/* different css */ 
}

Ora, io potrei creare file CSS separati chiamato IE_min768.css e IE_min972_max1024 e utilizzare Javascript per caricare dinamicamente e scaricare i file come la larghezza della pagina viene regolata. Ma questo viola la D.R.Y. e sarebbe un problema mantenere i CSS in più punti.

Sarebbe possibile utilizzare Javascript (solo in IE) per leggere effettivamente il file CSS, rilevare le sezioni @media e applicare dinamicamente tale CSS al browser nella situazione corretta?

fonte

2012-09-06 brentonstrine

ho letto da qualche parte l'osservazione spiritosa che "la mancanza di supporto di media query è il primo media query" :-) – Pointy

Solo una supposizione, ma si può usare '@ import' per asciugare il CSS? –

Altre informazioni a questo post: http://stackoverflow.com/questions/7444658/best-solution-framework-to-responsive-design-for-ie7?rq=1 – Kostia

Non reinventare la ruota. Basta usare respond.js.

Dal readme su GitHub:

L'obiettivo di questo script è quello di fornire uno script veloce e leggero (3kb minified/1kb compresso con gzip) per attivare progetti web responsive nei browser che non supportano CSS3 media Query - in particolare, Internet Explorer 8 e sotto. È scritto in modo tale che probabilmente correggerà anche il supporto per altri browser non di supporto (maggiori informazioni a breve).

fonte

2012-09-06 19:07:22

Funziona magnificamente! Per completezza, voglio anche menzionare [css3-mediaqueries-js] (http://code.google.com/p/css3-mediaqueries-js/) a cui il creatore di respond.js si collega. Rispondere sta funzionando per me dato che il mio CSS non è troppo complicato. – brentonstrine

Leggi un file CSS con Javascript e modifica dinamicamente la pagina

risposta

Problemi correlati