Come realizzare quick view in un negozio online

In questo articolo vediamo una delle soluzioni per realizzare cosi detto  quick view in un negozio online  per visualizzare la scheda del prodotto senza passare sulla sua pagina del prodotto con delle animazioni molto interessanti e la posibilita di agiungere articolo diretamente da quella schermata al carrello

Clicando sul articolo in vendita sotto si aprira la finestra di quick view

 

img 09

MTB

Comanche

Celiac distillery man braid venmo, selfies you probably haven't heard of them tote bag forage fanny pack activated charcoal kale chips lo-fi before they sold out.

499 euro
img 10

MTB

Comanche

Mumblecore bespoke blog raw denim, authentic VHS sustainable +1 freegan neutra small batch paleo. Schlitz chicharrones pork belly palo santo.

499 euro

 

 Questa soluzione e stata sviluppata da Filip Slováček   https://tympanus.net/codrops/2017/11/08/expanding-grid-item-animation/

Ho modificato un puo il codice per riportare questo effetto sulla pagina del sito ma penso che guardando markup html potrai capire che tutto si basa su una struttura a griglia al centro della quale si trova immagine e descrizione del vostro articolo in vendita. Sempre sulla pagina di origine indicata sopra potrai scaricare anche  i fail js che vengono usati per creare l'effetto.

 
Letto 69 volte