Poster
ALL COLLECTION
ALL COLLECTION
.amount{
font-weight: 700 !important;
}
.zoom img{
display: block;
width: 100%;
transition: transform 0.3s ease;
}
.zoom img:hover{
transform: scale(1.02);
}
/* Contenedor de las imágenes del producto */
.product-image-wrapper {
position: relative;
display: inline-block;
width: 100%;
max-width: 100%;
height: auto;
overflow: hidden;
}
/* Imágenes del producto */
.product-main-image,
.product-hover-image {
width: 100%;
height: auto;
display: block;
transition: opacity 0.5s ease-in-out;
}
/* La imagen principal es visible por defecto */
.product-main-image {
opacity: 1;
position: relative;
z-index: 2;
}
/* La imagen de hover está oculta inicialmente */
.product-hover-image {
opacity: 0;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
/* Efecto de cambio de imagen */
.product-image-wrapper:hover .product-main-image {
opacity: 0;
}
.product-image-wrapper:hover .product-hover-image {
opacity: 1;
}
/* Asegurar que las imágenes siempre sean visibles dentro de la tarjeta */
.fusion-woo-product-image img {
max-width: 100%;
height: auto;
display: block;
object-fit: cover;
}
/* Ajuste del contenedor de las tarjetas de productos */
.fusion-post-cards ul {
padding: 0;
margin: 0;
list-style: none;
}
.fusion-post-cards li {
text-align: center;
}
/* Estilos para los títulos */
.fusion-title h4 {
font-size: 1em;
font-weight: 700;
margin-top: 10px;
color: #0b1124;
}
/* Estilos para los precios */
.fusion-woo-price-tb {
font-size: 16px;
font-weight: bold;
color: #ff5733;
}
document.addEventListener("DOMContentLoaded", function () {
document.querySelectorAll(".product-main-image").forEach((img) => {
let galleryImages = JSON.parse(img.getAttribute("data-gallery")); // Obtener URLs
if (!galleryImages || galleryImages.length === 0) return;
let currentIndex = 0;
let interval;
img.addEventListener("mouseenter", function () {
interval = setInterval(() => {
img.classList.add("fade-out"); // Inicia la transición
setTimeout(() => {
currentIndex = (currentIndex + 1) % galleryImages.length;
img.src = galleryImages[currentIndex];
img.classList.remove("fade-out"); // Quita la clase después de cambiar la imagen
}, 1000); // 400ms para coincidir con la animación de CSS
}, 1000); // Cambia cada 1 segundo
});
img.addEventListener("mouseleave", function () {
clearInterval(interval);
img.classList.add("fade-out");
setTimeout(() => {
img.src = img.getAttribute("src"); // Volver a la imagen principal
img.classList.remove("fade-out");
}, 1000);
});
})
});
-
Original price was: S/ 60.00.S/ 40.00Current price is: S/ 40.00.
