`;
imageInfo.variations.forEach((variation, index) => {
imagesHtml += `
`;
});
imagesHtml += `
`;
imageContainer.innerHTML = imagesHtml;
imageContainer.classList.remove('hidden');
// Alternar imagens ao clicar no botão de troca
const swapButtons = document.querySelectorAll('.swap-button');
swapButtons.forEach(button => {
const index = button.getAttribute('data-variation-index');
const variation = imageInfo.variations[index];
let currentImageIndex = 0;
button.addEventListener('click', () => {
const variationImage = button.previousElementSibling; // Atualiza a imagem da variação
// Aplica o efeito de saída
variationImage.classList.add('fade-out');
// Aguarda o término da animação antes de trocar a imagem
setTimeout(() => {
currentImageIndex = (currentImageIndex + 1) % variation.additionalImages.length;
variationImage.src = variation.additionalImages[currentImageIndex].url;
variationImage.style.width = `${variation.additionalImages[currentImageIndex].width}px`;
// Remove o efeito de saída e aplica o efeito de entrada
variationImage.classList.remove('fade-out');
variationImage.classList.add('fade-in');
// Remove o efeito de entrada após a transição
setTimeout(() => {
variationImage.classList.remove('fade-in');
}, 300); // Duração da animação CSS (0.3s)
}, 300); // Sincroniza com a duração do efeito de saída
});
});
}
`;
// Exibe `descriptionIMG` se estiver presente
if (variation.descriptionIMG) {
imagesHtml += `
`; } imagesHtml += `Nome: ${variation.description}
`; // Exibe `obtain` se estiver presente if (variation.obtain) { imagesHtml += `Como Obter: ${variation.obtain.text}
`; } // Exibe `customColor` se estiver presente if (variation.customColor) { imagesHtml += `Cor Customizável: ${variation.customColor}
`; } imagesHtml += `
`; } imagesHtml += `Nome: ${variation.description}
`; // Exibe `obtain` se estiver presente if (variation.obtain) { imagesHtml += `Como Obter: ${variation.obtain.text}
`; } // Exibe `customColor` se estiver presente if (variation.customColor) { imagesHtml += `Cor Customizável: ${variation.customColor}
`; } imagesHtml += `
Recompensas Froslass
Item | Quantidade | Raridade | |
---|---|---|---|
![]() |
Study Notes | 20 | Comum |
![]() |
Bag Of Nightmare Experience Candy | 1 | Comum |
![]() |
Ice Blocks | 20 | Comum |
![]() |
Solid Ice Cubes | 100 | Comum |
![]() |
Ice Orbs | 50 | Comum |
![]() |
Seavell Essence | 2 | Comum |
![]() |
Malefic Essence | 2 | Comum |
![]() |
Dawn Stone | 1 | Comum |
![]() |
Uncommon Figure Pack | 1 | Lendario |
![]() |
Rare Figure Pack | 1 | Lendario |
![]() | |||
![]() |