Váltás stílusok css és a változás a site design függően a napszaktól vagy évszaktól

Helló kedves olvasók! Nemrégiben vált népszerű változtatni a design a helyén, attól függően, hogy a napszak vagy évszakban. Például, a nap a helyszínen megjelenik világosabb tónusok, és az éjszaka, éppen ellenkezőleg, sötétebb lesz. Vagy például, több helyről a téli, közel az új évet a fejlécben vannak a különböző díszítések formájában karácsonyi labdák és karácsonyfák. CSS stíluslapok teszi a webes tervezők minimális erőfeszítést megváltoztatni a megjelenését az oldalon. Következő, lássuk, hogyan lehet egy ilyen változás a design, attól függően, hogy a napszaktól vagy év.

Megváltoztatni a design a helyén van ahhoz, hogy helyettesítse a CSS-stíluslap fájlt, attól függően, hogy az idő vagy dátum.

Megvalósítása érdekében a mechanizmus tervmódosítás kell készülni több lehetőség CSS-fájlokat. Például, hogy módosítsa a nappal és az éjszaka tervezési elkészíti két fájlt: day.css és night.css.

Amint látható, az egyszerű kódot. Alapértelmezett csatlakozni napi fájl day.css stílusokat. Ezután egy Date objektum határozza meg az aktuális órát és az ügyfél, ha nem esik az éjszakai intervallum változása nappali és éjszakai stylesheet night.css.

Ha az éjszaka, valahogy így:

A forráskód példák innen lehet letölteni.

Site design függően évszakban

Ismét mi készül több CSS-fájlok, például spring.css, summer.css, autumn.css és winter.css.

Annak megállapításához, hogy az évszaktól, tudjuk, hogy az aktuális hónap is elég. Együttműködik a dátum PHP függvénye date (). Annak megállapításához, hogy az évszaktól mi írjuk a funkció:

működnek getSeason ()
$ Hónap = date ( 'n'); // meghatározza számos aktuális hónap
switch ($ havonta)
1. eset:
2. eset:
esetében 12: return 'téli';
3. eset:
4. eset:
5. eset: visszatérés „tavasz”;
esetben 6:
esetében 7:
esetében 8: visszatér a „nyár”;
esetében 9:
esetében 10:
esetében 11: visszatérés őszi ';
alapértelmezett: visszatérés a „nyár”;
>
>

És mi adjuk hozzá a funkció egy html-kód: