Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Zoom on hover on product list


Ptphotography

Question

Good day,

Please help us with the code to zoom in the product images on hover. We want it to have the same effect as our gallery page:

https://www.ptphotography.com/stmoritz-badrutts-palace-hotel-switzerland

This is code we used for the gallery page if it is helpful:

.gallery-grid-item
img:hover{height:100%!important;
width:100%!important;
transform:Scale(1.2);
overflow:hidden!important;
transition-duration:.5s}

.gallery-grid-item 
{overflow:hidden!important}

This is the link for our product page we want zoomed in:
https://www.ptphotography.com/destination-trial

Thank you in advance,
K

 

Link to post
  • Answers 2
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Add to Page Header <style> .grid-item:hover img { transform: scale(1.9); transition-duration:.5s; } .grid-image {overflow:hidden!important;} </style>  

2 answers to this question

Recommended Posts

  • 1

Add to Page Header

<style>
  .grid-item:hover img {
    transform: scale(1.9);
    transition-duration:.5s;
}
.grid-image {overflow:hidden!important;}
</style>

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...