jQuery Mobile sticky footer

Mattepuffo's logo
jQuery Mobile sticky footer

jQuery Mobile sticky footer

Per un progettino sto usando jQuery Mobile, e come ogni volta mi ritrovo con qualche problematica che vedo essere richiesta anche in giro per il web.

In questo caso parliamo di come impostare il footer a fondo pagina.

Perchè di fatto, di default, il footer di JQM non è fisso, e sulle pagine non è bello vedere il footer che sta a metà schermata.

Il problema è facilmente risolvibile con due regole CSS; l'unica problema riscontrata è che sui dispostivi mobili la regola viene applicata con un pò di ritardo rispetto all'apertura della pagina.

Fastidio marginale, però a me personalmente non mi piace molto.

Comunque questa la regola:

[data-role=page]{ height: 100% !important; position:relative !important; }
[data-role=footer]{ bottom:0; position:absolute !important; top: auto !important; width:100%; }

Io alla fine ho levato il footer, per rimpiazzarlo con una apposita pagina di About.

A voi la scelta.

Enjoy!


Condividi

Commentami!