jQuery 7 snippet sempre utili

SNIPPET 1: disabilitare il comportamento di default di un link

Per diverse ragioni può essere utile usare il tag a per scopi differenti da raggiungere una parte del documento corrente o un’altra pagina. In questi casi dobbiamo disabilitare il comportamento di default, jQuery ci viene in aiuto con una sintassi semplice e coincisa

[crayon-5d88b9f7c7804576277962/]

SNIPPET 2: wrappare la prima lettera di una stringa

Questo snippet in jQuery permette di selezionare tramite un’espressione regolare la prima lettera di una stringa. Può risultare utile, ad esempio, per applicare una capolettera a un paragrafo, o come nel mio caso, a colorare di rosso la prima lettera del titolo di questo blog.

[crayon-5d88b9f7c7810893965969/]

[Stackoverflow]

SNIPPET 3: creazione e gestione di un pulsante per lo scrolltop

Nei siti mono-pagina e nei blog è buona norma, quasi uno standard, fornire un modo agevole per tornare in cima. Questo script crea il pulsante (che dovrà essere opportunamente posizionato in modalità fixed in basso a destra) e verrà visualizzato a necessità quando l’utente scrolla verso il basso. Alla pressione del pulsante verrà avviata una breve animazione

[crayon-5d88b9f7c7814111257801/]

SNIPPET 4: rilevare dispositivi mobili

Esistono sicuramente metodi più completi e raffinati ma spesso può essere utile eseguire script specificatamente indirizzati ai dispositivi mobili. Questo snippet permette di farlo

[crayon-5d88b9f7c7817609469872/]

SNIPPET 5: verifica la presenza di un elemento del DOM

Trovo molto utile verificare se nel dom esista o meno un elemento al fine di lanciare uno script. Per farlo è sufficiente questo snippet

[crayon-5d88b9f7c781b805261541/]

SNIPPET 6: converto una lista linkata in un campo select adibito alla navigazione

Questo script mi è stato utile in diversi frangenti. Ad esempio per trasformare un menu in qualcosa di più compatto in layout responsivi

[crayon-5d88b9f7c781e300142744/]

SNIPPET 7: navigatore locale con ancore

Questo script diventa utile se si desidera rendere maggiormente leggibile un testo strutturato in più sezioni. In pratica viene creato un box con tanti link quanti sono gli h3 dell’articolo. Ogni link è all’ancora corrispondente all’id del titoletto.

[crayon-5d88b9f7c7822367231435/]

 

Rispondi

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

Leggi articolo precedente:
Guida galattica per gli autostoppisti

"A chiunque sia capace di farsi eleggere Presidente non dovrebbe essere permesso di assumere l'incarico."

Chiudi