Efektowne tło dzięki wtyczce Stellar

Jak dogonić współczesne trendy w web designie? Jak sprawić by prosta strona była w pełni nowoczesna i efektowna?

Oto jeden, całkiem prosty sposób, dzięki któremu ożywimy wygląd strony i sprawimy by był bardziej dynamiczny.

Mowa o bardzo popularnym efekcie ruchomego tła, który można uzyskać np. dzięki wtyczce do jQuery - Stellar

źródło: http://markdalgleish.com/projects/stellar.js/demos/backgrounds.html

Krótko, technicznie, jak to działa...
w znacznikach div ustawiamy tła strony, którymi sterujemy poprzez dodanie odpowiednich atrybutów wtyczki Stellar

Wtyczka wraz z przewijaniem strony zmienia pozycje teł z odpowiednią prędkością...

Zobacz demo działania wtyczki

Bezsensowne jest wyjaśnianie z mojej strony konfiguracji wtyczki, gdyż jest ona wyjątkowo prosta i zaopatrzona w jasną dokumentację:

dokumentacja wtyczki Stellar

Jak widać główne parametry do ustawienia to współczynnik prędkości przewijania tła oraz pozycja tła.
Możemy też zdefiniować, czy chcemy przewijać tło poziomo, czy pionowo. No i co ciekawe wtyczka nadaje się do Responsive Design :)

Więcej szczegółów w dokumentacji oczywiście...

A tutaj przykładowa strona wykorzystująca całkiem efektownie wtyczkę: getsite4business.co.uk

Plik skryptu waży niecałe 13kB