image par hover
Page: Homepage
Snippet Code
<style>
.section-template--18231110500591__11b770c9-d589-465e-989b-51639686e57c-padding {
padding-top: 20px;
padding-bottom: 30px;
}
.Container {
margin: 0 auto;
}
.SectionHeader--center {
text-align: center;
}
.SectionHeader .SectionHeader__Heading.Heading {
font-family: Montserrat, sans-serif;
color: #9f785b;
letter-spacing: 3px;
font-size: 26px;
margin: 0 0 10px;
text-transform: lowercase;
}
.SectionHeader .SectionHeader__Heading.sub-title {
font-family: Montserrat, sans-serif;
color: #4d5959;
font-size: 17px;
font-weight: 400;
letter-spacing: 1px;
text-transform: lowercase;
}
.SectionHeader__Heading.SectionHeader__Heading {
margin-top: -3.9px;
}
h3:last-child {
margin-bottom: 0;
}
.image-gallery-section .image-gallery-row {
display: flex;
flex-wrap: wrap;
margin-right: 0;
}
.image-gallery-section .image-gallery-box {
width: 100%;
cursor: pointer;
overflow: hidden;
position: relative;
}
.image-gallery-section .image-gallery-box img {
width: 100%;
height: 270px;
/* Fixed height */
object-fit: cover;
transform: scale(1);
transition: all 1.9s ease-in-out;
}
img {
max-width: 100%;
border-style: none;
vertical-align: top;
}
.image-gallery-section .image-gallery-content {
height: 100%;
width: 100%;
z-index: 1;
position: absolute;
top: 0;
left: 0;
display: none;
background-color: #00000085;
}
.image-gallery-section .image-gallery-content a {
color: #fff;
text-transform: uppercase;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
a {
background-color: transparent;
text-decoration: none;
}
.image-gallery-section .image-gallery-box:hover img {
transform: scale(1.2);
}
.image-gallery-section .image-gallery-box:hover .image-gallery-content {
display: flex;
align-items: center;
justify-content: center;
}
a:hover {
outline: 0;
}
.SectionHeader:not(:only-child) {
margin-bottom: 40px;
}
/* 6 images per row on desktop */
.image-gallery-section .image-gallery-item {
width: 16.66%;
/* 100 / 6 */
margin: 0;
/* padding: 2px; */
box-sizing: border-box;
}
/* Responsive - tablet */
@media screen and (max-width: 1024px) {
.image-gallery-section .image-gallery-item {
width: 25%;
/* 4 per row */
}
}
/* Responsive - mobile */
@media screen and (max-width: 768px) {
.section-template--18231110500591__11b770c9-d589-465e-989b-51639686e57c-padding {
padding-top: 20px;
padding-bottom: 15px;
}
.SectionHeader .SectionHeader__Heading.Heading {
font-size: 18px;
margin: 0 0 5px;
}
.SectionHeader .SectionHeader__Heading.sub-title {
font-size: 11px;
}
.image-gallery-section .image-gallery-item {
width: 50%;
/* 2 per row */
}
.image-gallery-section .image-gallery-box img {
width: 100%;
height: 127px;
/* Fixed height */
object-fit: cover;
transform: scale(1);
transition: all 1.9s ease-in-out;
}
}
@media screen and (max-width: 480px) {
.image-gallery-section .image-gallery-item {
width: 33%;
/* 1 per row */
}
}
@media screen and (min-width: 1140px) {
.image_gallery {
padding-left: 50px;
padding-right: 50px;
}
.Container {
padding: 0 80px;
}
}
</style>
<div id="shopify-section-template--18231110500591__11b770c9-d589-465e-989b-51639686e57c"
class="shopify-section image-gallery-section">
<section class="image_gallery Section section-template--18231110500591__11b770c9-d589-465e-989b-51639686e57c-padding"
data-section-id="template--18231110500591__11b770c9-d589-465e-989b-51639686e57c" style="background-color: #ffffff">
<div class="Container">
<header class="SectionHeader SectionHeader--center">
<h2 class="SectionHeader__Heading Heading u-h1">Wear It. Love It. Share It</h2>
<h3 class="SectionHeader__Heading sub-title u-h6">#kiddzy.in</h3>
</header>
<div class="image-section">
<div class="image-gallery-row">
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_3.58.50_PM_59aeccbc-5b97-40fa-b5ef-f41de1150efd.jpg?v=1757327563"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_3.58.50_PM_59aeccbc-5b97-40fa-b5ef-f41de1150efd.jpg?v=1757327563">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_105_WhatsAppImage2025-09-10at5.40.38PM.jpg?v=1757566427"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_105_WhatsAppImage2025-09-10at5.40.38PM.jpg?v=1757566427">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_3.04.07_PM.jpg?v=1757324924"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_3.04.07_PM.jpg?v=1757324924">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_2.35.17_PM.jpg?v=1757323208"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_2.35.17_PM.jpg?v=1757323208">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_107_WhatsApp_Image_2025-09-10_at_10.28.16_PM_83578a64-9a80-418d-a9d1-d5a7fbaa7217.jpg?v=1757566923"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_107_WhatsApp_Image_2025-09-10_at_10.28.16_PM_83578a64-9a80-418d-a9d1-d5a7fbaa7217.jpg?v=1757566923">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_4.06.51_PM.jpg?v=1757328641"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/WhatsApp_Image_2025-09-08_at_4.06.51_PM.jpg?v=1757328641">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_28_WhatsApp-Image-2025-07-09-at-5.11.33-PM-scaled.jpg?v=1757395532"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_28_WhatsApp-Image-2025-07-09-at-5.11.33-PM-scaled.jpg?v=1757395532">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_28_WhatsApp-Image-2025-07-04-at-11.37.58-AM-scaled.jpg?v=1757395528"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_28_WhatsApp-Image-2025-07-04-at-11.37.58-AM-scaled.jpg?v=1757395528">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_107_ChatGPTImageAug12_2025_11_16_00AM.jpg?v=1757566421"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_107_ChatGPTImageAug12_2025_11_16_00AM.jpg?v=1757566421">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_32_WhatsApp-Image-2025-08-02-at-3.28.24-PM-scaled.jpg?v=1757395670"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_32_WhatsApp-Image-2025-08-02-at-3.28.24-PM-scaled.jpg?v=1757395670">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_82_WhatsAppImage2025-09-10at1.07.54PM.jpg?v=1757566928"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_82_WhatsAppImage2025-09-10at1.07.54PM.jpg?v=1757566928">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
<div class="image-gallery-item">
<div class="image-gallery-box">
<img class=" Image--lazyLoaded"
data-src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_125_WhatsAppImage2025-09-10at9.50.25PM.jpg?v=1757566593"
loading="lazy"
src="https://cdn.shopify.com/s/files/1/0696/7164/9474/files/imgi_125_WhatsAppImage2025-09-10at9.50.25PM.jpg?v=1757566593">
<div class="image-gallery-content">
<a href="https://www.instagram.com/kiddzy.in?igsh=cWp2OGhvY2Vma2hx&utm_source=qr" target="_blank">see
more</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>Instructions
Heyy Guys 
Watch the video below to learn how to Import these Codes into your Shopify Ecommerce Store!