Mi è stato chiesto di prendere in consegna un progetto web. Dovrebbe essere un sito web reattivo, ma l'ex programmatore non ha scritto HTML / CSS con responsività in mente e l'aggiunta di codice per renderlo reattivo sarebbe un incubo. La versione mobile su m.domain.ltd non è accettata dal client per qualche motivo. Va bene sostituire semplicemente l'intera pagina (chiamata ajax al server) con un altro contenuto quando la finestra viene ridimensionata o caricata, ad esempio, < 780px? Grazie
Sostituisci l'intero contenuto con una chiamata ajax? Nevar! Questa è un'idea folle!
CSS3 ora supporta le cosiddette "media query" che individuano la larghezza e l'altezza della tua finestra e possono impostare nuove regole CSS.
Ecco un esempio di uno dei miei progetti attuali
@media only screen and (max-width: 1260px) {
#left_wrap {
visibility: hidden;
}
#usercard {
background: magenta;
}
#right_wrap {
margin-left: 10px;
width: 926px;
}
#shortWidthUserCard {
visibility: visible;
}
}
Le regole precedenti impostano valori diversi, quando la larghezza è inferiore a 1260px per la finestra, queste regole sono applicate in precedenza.
Sii gentile con il ragazzo che manterrà il codice dopo tu.
Leggi altre domande sui tag html css responsive-design