Woocommerce hover zoom catalogus-pagina

  • Dion91

    (@dion91)


    9 jaren geleden

    Hallo,

    Ik zou graag willen dat de afbeeldingen op de volgende pagina ingezoomd worden zodra ik er met mijn muis overheen beweeg (hovering).
    Klik hier voor de pagina.

    Ik kan hier echter geen goede (gratis) plugin voor vinden. Alle plugins hebben betrekking tot de productpagina’s, maar ik wil het uitsluitend op de cataloguspagina. Is er iemand die een oplossing heeft?

    Alvast bedankt!

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Moderator Richard van Denderen

    (@rdd)

    8 jaren, 11 maanden geleden

    Hoi Dion,

    Je kan een effect als dat voor elkaar krijgen met CSS code.

    De meest eenvoudige manier om CSS toe te voegen aan WordPress is doormiddel van de Custom CSS functionaliteit van de Jetpack plugin. Die plugin en informatie over de CSS functie kan je hier vinden: http://jetpack.me/support/custom-css/

    Als je daar de volgende CSS in plaatst heb je een klein zoom effect werkend op alle producten:

    li.product:hover img.attachment-shop_catalog.wp-post-image{
-webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
        transform: scale(1.1);
}
    Thread starter Dion91

    (@dion91)

    8 jaren, 11 maanden geleden

    Hartstikke bedankt! Het is me gelukt 🙂

    Is er ook nog een manier om de afbeeldingen scherper te krijgen? Heb in het verleden al weleens gescript omdat blurry foto’s in de catalogus een bekend probleem was van Woocommerce. Moet ik nog iets aanpassen om de foto’s ook weer scherp te krijgen bij de hover?

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Het onderwerp ‘Woocommerce hover zoom catalogus-pagina’ is gesloten voor nieuwe reacties.