Nie zawsze potrzeba zaawansowanych animacji, JavaScriptów czy zewnętrznych bibliotek, żeby strona „żyła”.
Czasem wystarczy kilka grafik zmienianych w zależności od pory dnia.To rozwiązanie sprawdza się:- na stronach szkolnych (dzieci jadą do szkoły, przerwa, powrót do domu),
- na stronach instytucji i zakładów pracy,
- na prostych portalach informacyjnych,
- wszędzie tam, gdzie chcemy subtelny efekt, a nie fajerwerki.
Nie musi to być słońce i księżycNajczęstszy błąd: myślenie wyłącznie „słońce w dzień – księżyc w nocy”.
A przecież noc niewiele się zmienia, za to dzień ma wyraźne fazy.
Zamiast obiektów astronomicznych można użyć:- tła (jasne / neutralne / ciepłe),
- ilustracji (droga do szkoły, przerwa, powrót),
- ikon (rano / południe / popołudnie),
- prostych scenek.
Przykładowy podział dnia (logiczny i czytelny)Noc
jedna grafika – spokojna, neutralna- rano (start dnia, wyjazd do szkoły / pracy),
- środek dnia (lekcje, praca, przerwa),
- popołudnie (powrót do domu).
Technicznie – jak to działa (w skrócie)- strona sprawdza aktualną godzinę lub porę dnia,
- na tej podstawie wybiera jedną z kilku grafik,
- nie potrzeba animacji klatkowych ani JS,
- grafika zmienia się automatycznie po odświeżeniu strony.
[detalis]
<?php
$sunrise = date_sunrise(time(), SUNFUNCS_RET_TIMESTAMP, 53, 22, 90, 1);
$sunset = date_sunset(time(), SUNFUNCS_RET_TIMESTAMP, 53, 22, 90, 1);
$now = time();
$dayLength = $sunset - $sunrise;
$quarter = $dayLength / 4;
if ($now < $sunrise || $now > $sunset) {
$img = 'night.png';
} elseif ($now < $sunrise + $quarter) {
$img = 'sunrise.png';
} elseif ($now < $sunrise + 3 * $quarter) {
$img = 'sun_zenith.png';
} else {
$img = 'sunset.png';
}
?>
<img src="images/<?php echo $img; ?>">
[/detalis]
