it.hideout-lastation.com
Paradiso Per Designer E Sviluppatori


Crea un'intestazione appiccicosa auto-nascondere con Headroom.js

Le intestazioni di nascondiglio automatico sono state costantemente popolari nel web design per un po 'di tempo. Molti blog e riviste online utilizzano l'intestazione appiccicosa per mantenere gli utenti impegnati e dare loro l'accesso diretto alla navigazione .

Medium ha ridefinito questa funzione con un concetto di base che nasconde la navigazione durante lo scorrimento verso il basso, ma lo mostra durante lo scorrimento verso l'alto . Questo concetto è diventato una tendenza molto popolare e ora puoi facilmente replicarlo utilizzando Headroom.js .

Headroom.js è una libreria JavaScript vanilla gratuita senza dipendenze o funzioni API eccessive. Basta aggiungerlo al codice HTML, indirizzare l'intestazione della pagina e lasciarla funzionare.

Headroom aggiunge e rimuove alcune classi CSS che animano per mostrare / nascondere l'intestazione usando JavaScript per rilevare il movimento.

Potresti fare da solo questa funzionalità ma perché preoccuparti? Headroom è testato e supporta tutti i principali browser . Funziona anche con jQuery o Zepto se hai già una libreria JS installata sul tuo sito.

Troverai un sacco di esempi di codice nel repository GitHub, ma ecco un semplice esempio che si rivolge all'elemento #header :

 var myElement = document.querySelector ("# header"); // crea un oggetto Headroom che passa nell'elemento #header var headroom = new Headroom (myElement); // inizializza la libreria headroom.init (); 

La funzione init() ha molte opzioni da personalizzare . È possibile personalizzare le diverse classi di elementi, insieme a diversi callback di trigger di eventi in cui è possibile incorporare le proprie funzioni . Ad esempio, se vuoi che l'elemento si dissolva dopo che è stato sbloccato, useresti il ​​callback onUnpin .

Queste opzioni sono tutte elencate nella pagina principale del plugin, quindi dai un'occhiata e vedi cosa ne pensi. Se vuoi vedere Headroom in azione dai un'occhiata alla penna qui sotto che contiene un clone completo della pagina demo principale .

20 modelli "Prossimamente" che vale la pena aspettare

20 modelli "Prossimamente" che vale la pena aspettare

Quindi stai cercando di dare al tuo sito WordPress un nuovo aspetto e stai cercando di capire i nodi in tempo per il 2015; oppure hai una nuova app, prodotto, azienda o album che vuoi rilasciare e speri di generare un po 'di entusiasmo pubblicando un sito Coming Soon . Quindi, avrai bisogno di te stesso un fantastico tema Coming Soon o Under Construction

(Consigli tecnici e di design)

Come scoprire chi c'è dietro quell'indirizzo email

Come scoprire chi c'è dietro quell'indirizzo email

Immaginare questo. Hai ricevuto un'email con l'affermazione che hai vinto qualche premio o importo in un'estrazione fortunata o forse hai ricevuto un'email che sembra molto interessante. Prima di poterti fidare del messaggio trasmesso via email e prima di inviare la tua risposta, è importante identificare correttamente la persona che è associata a questa email .D

(Consigli tecnici e di design)