Applica l'effetto di zoom uniforme alle immagini con Zoomer

C'è una citazione che dice "un'immagine vale più di mille parole". Nel web design, diventa ancora più rilevante. Soprattutto quando si tratta di mostrare prodotti, ad esempio in un sito di e-commerce. Le persone hanno bisogno di avere una comprensione chiara ed essere in grado di guardare il prodotto in modo visivo prima di effettuare un acquisto, dopo tutto.

Rendere l'immagine più grande possibile non può risolvere questo problema, poiché richiederà anche un'enorme quantità di spazio disponibile. Pertanto la scelta migliore è rendere l'immagine zoomabile. Con Zoomer puoi farlo facilmente.

Zoomer è una libreria javascript gratuita che consente di ingrandire l'immagine . Quando è abilitato, aggiungerà il proprio stile e un pulsante per lo zoom avanti e indietro. Supporta anche più immagini, che verranno automaticamente trasformate in una galleria di immagini.

Inizializzazione

Prima di inizializzarlo, prima includi lo script Zoomer (che puoi ottenere dalla pagina GitHub) nel tuo progetto in questo modo:

Zoomer circonda l'immagine con il suo stile e aggiunge un pulsante di ingrandimento e riduzione. Dovresti includere il foglio di stile Zoomer prima del tag di chiusura della head .

 ..  .. 

Zoom avanti e indietro

Per creare un nuovo Zoomer, includere facilmente un'immagine all'interno di un wrapper. Non dimenticare di dare al wrapper un'altezza e una larghezza fisse in quanto tutto lo spazio disponibile sarà riempito dal nuovo markup. Ad esempio, creo un wrapper con il nome di .zoomable e definisco l'altezza a 500px e la larghezza a 100% in questo modo:

 .zoomable {height: 500px; larghezza: 100%; } 

Quindi avvolgo l'immagine che voglio rendere zoomabile, come di seguito:

        

          
          

		  
50 fantastici Street Art 3D e murales in tutto il mondo
            
La creatività può essere espressa in molte forme diverse e una delle forme più potenti di arte pubblica è la street art . Tuttavia, al giorno d'oggi, gli artisti di strada lavorano in alcune forme d'arte non convenzionali, sperimentando la prospettiva e l'immaginazione umana, creando i murales 3D .I m
			
(Consigli tecnici e di design)
          
        
      

        

          
          

		  
Migliori Design Freebies of the Year 2017
            
Nell'ultimo anno abbiamo assistito ad un enorme aumento del numero di blog di design e gallerie PSD. La grande parte qui è che i web designer e i grafici stanno diventando più interessati a condividere le loro idee e lavorare con Internet, e questa grande attitudine ha dato vita a numerosi omaggi di design di alta qualità provenienti da tutto il mondo!Di
			
(Consigli tecnici e di design)
          
        
      

  
  
  



Articoli Interessanti






			
	
				

					10 (Altro) Cool Biking Gadgets per The Avid Cyclist
					

			
	
				

					Come disattivare la manutenzione automatica di Windows 10
					
						







			
	
				

					Nagbot è un robot che ti motiva a lavorare attraverso l'assillare
					

			
	
				

					Bellissimi disegni di relazione annuale