2013-04-14 13 views
5

Recentemente ho creato un sito Web reattivo. Io uso Zurb Foundation perché alcuni consigli e articoli sono la soluzione migliore per rendere più efficiente il sito responsive. Ma il problema, la nuova versione di Foundation non supporta IE 7+, come si può vedere here, ma voglio il mio sito web di supporto per tutta la versione di IE. Alcuni suggeriscono consigli per usare la vecchia Fondazione (cioè vers 3). Ma penso che la versione più recente sia la migliore.Come creare un nuovo supporto per Zurb Foundation per IE 7+?

La mia domanda, qualsiasi soluzione per creare un nuovo supporto Foundation (vers.4) per IE? Ho bisogno del consiglio perché sono impilato qui. Grazie

+0

Non si vede che questo [gist] (https://gist.github.com/zurbchris/5068210) forniscono una griglia per IE8 ? È collegato nei loro documenti. – Pigueiras

+0

@Pigueiras: sì, ci provo prima ma il suo uso per IE 8 ma non è utile per IE 7 o inferiore. Quindi, sono davvero impilato qui. – user2272831

+2

Sei molto avanzato con il tuo progetto? Secondo me, non dovresti aver usato un framework CSS che non supporta IE7, se questo era uno dei tuoi requisiti. Ci sono altri framework che supportano IE7 come Twitter Bootstrap o Skeleton. Ad ogni modo, perché è davvero necessario il supporto IE7 per il tuo sito? [Non ci sono molte persone con quel browser nel mondo] (http://theie7countdown.com/). – Pigueiras

risposta

9

Il problema con IE7 e IE8 è che non hanno il supporto integrato per le query multimediali.

Ci sono alcune opzioni che possono aiutare voi, cross-browser polyfills che aggiungere supporto di query multimediali ai vecchi browser.

I due più popolari sono respond.js e css3-mediaqueries.js. Ho avuto successo con entrambi.

Nella parte superiore della pagina, si verifica il browser e si carica uno di questi script, se necessario.

modi che ho fatto in passato sono o con i commenti condizionali:

<!--[if (lt IE 9) & (!IEMobile)]> 
<script src="path-to/respond.js"></script> 
<![endif]--> 

o utilizzando modernizr

Modernizr.load([ 
{ 
// The test: does the browser understand Media Queries? 
test : Modernizr.mq('only all'), 
// If not, load the respond.js file 
nope : '/js/respond.js' 
} 
]); 

Entrambi i metodi sono abbastanza facile da provare, e anche se se don Ti aiuteremo in questo caso specifico, probabilmente avrai l'opportunità di provarli di nuovo su un altro sito.

Buona fortuna!

0

Ho scritto questo http://justthisguy.co.uk/responsive-sass-and-ie/ che analizza l'utilizzo del bootstrap e che ha generato un foglio di stile ie7 che per impostazione predefinita è la visualizzazione desktop. Ho intenzione di lavorare su una versione di base di esso ad un certo punto. Essa si traduce in una certa duplicazione di regole css ma qualcosa di simile https://github.com/addyosmani/grunt-uncss potrebbe essere utilizzato per rimuovere la duplicazione

Problemi correlati