Aggiungi effetti di ingrandimento sulla tua pagina Web con jfMagnify

Ce ne sono molti plugin per lo zoom gratuiti funzionano incredibilmente bene. Tuttavia, la maggior parte di questi sono costruito per immagini e specificano le direzioni per contenuto di sola immagine.

E se potessi aggiungere un effetto di ingrandimento ad ogni parte della tua pagina web? Grazie a jfMagnify, Puoi.

È un plugin gratuito jQuery che supporta non solo lo zoom dell'immagine, ma anche zoom di tutta la pagina. È uno dei pochi plugin che ti permette anche scegli il livello di ingrandimento e supporta gli eventi tattili per utenti mobili.

Nota questo plugin può sembrare un po 'pesante perché si basa su due dipendenze: jQuery normale e Interfaccia utente di jQuery. Questi sono entrambi necessari per far funzionare correttamente jfMagnify. Per non parlare del effettivo script jfMagnify dovrai includere nella tua pagina.

L'installazione è un po 'complicata perché puoi solo indirizzare gli elementi ingranditi all'interno di un contenitore. Se vuoi scegliere come target l'intera pagina che ti servirà includi un corso sul tuo intero sito web.

Ecco come singola riga di jQuery assomiglierebbe a:

 $ ( "Magnificare") jfMagnify ().; 

Questo obiettivi tutti gli elementi all'interno del .ingrandire contenitore che di solito è un div elemento.

Questi elementi interni possono essere immagini, ma potrebbero anche include una piccola stampa, per esempio sui termini del sito o sulle pagine di politica sulla privacy. Tutta la documentazione è disponibile nel repository GitHub, quindi una volta impostato, l'intero processo diventa molto più semplice.

Inoltre, questo plugin è molto volubile e viene fornito con un sacco di regole del contenitore. Ad esempio, l'elemento contenitore non può avere una posizione CSS statica, quindi deve essere relativo, assoluto o fisso.

Puoi trova tutte le regole di stile predefinite nel repository GitHub ma potrebbe essere un problema personalizzare se il tuo layout è già compilato e funzionante. I vantaggi di jfMagnify sono, per me, meritevoli. In realtà, dipende dalle tue esigenze e se ti piace l'interfaccia.

Dai un'occhiata ai documenti su GitHub per vedere cosa ne pensi. E puoi anche anteprima l'interfaccia su CodePen se vuoi vedere la libreria in azione prima di installarla.