Widget:Test: mudanças entre as edições

Ir para navegação Ir para pesquisar
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
Linha 61: Linha 61:


         .variation-item img {
         .variation-item img {
            width: 100px;
            height: 100px;
             display: block;
             display: block;
             margin: 0 auto 10px;
             margin: 0 auto 10px;
Linha 104: Linha 102:
                         },
                         },
                         additionalImages: [
                         additionalImages: [
                             'https://wiki.pokexgames.com/images/d/dd/Squirtle_Purple_Ninja_Pack_Frente.png', // Frente
                             { url: 'https://wiki.pokexgames.com/images/d/dd/Squirtle_Purple_Ninja_Pack_Frente.png', width: 30 }, // Frente
                             'https://wiki.pokexgames.com/images/5/50/Squirtle_Purple_Ninja_Pack_Esquerda.png',   // Lado Esquerdo
                             { url: 'https://wiki.pokexgames.com/images/5/50/Squirtle_Purple_Ninja_Pack_Esquerda.png', width: 30 }, // Lado Esquerdo
                             'https://wiki.pokexgames.com/images/a/af/Squirtle_Purple_Ninja_Pack_Direita.png',   // Costas
                             { url: 'https://wiki.pokexgames.com/images/a/af/Squirtle_Purple_Ninja_Pack_Direita.png', width: 30 }, // Costas
                             'https://wiki.pokexgames.com/images/5/5d/Squirtle_Purple_Ninja_Pack_Costas.png'   // Lado Direito
                             { url: 'https://wiki.pokexgames.com/images/5/5d/Squirtle_Purple_Ninja_Pack_Costas.png', width: 30 }  // Lado Direito
                         ]
                         ]
                     },
                     },
Linha 118: Linha 116:
                         },
                         },
                         additionalImages: [
                         additionalImages: [
                             'https://wiki.pokexgames.com/images/1/13/Squirtle_Red_Ninja_Pack_Frente.png', // Frente
                             { url: 'https://wiki.pokexgames.com/images/1/13/Squirtle_Red_Ninja_Pack_Frente.png', width: 30 }, // Frente
                             'https://wiki.pokexgames.com/images/1/1e/Squirtle_Red_Ninja_Pack_Esquerda.png',   // Lado Esquerdo
                             { url: 'https://wiki.pokexgames.com/images/1/1e/Squirtle_Red_Ninja_Pack_Esquerda.png', width: 30 }, // Lado Esquerdo
                             'https://wiki.pokexgames.com/images/0/01/Squirtle_Red_Ninja_Pack_Costas.png',   // Costas
                             { url: 'https://wiki.pokexgames.com/images/0/01/Squirtle_Red_Ninja_Pack_Costas.png', width: 30 }, // Costas
                             'https://wiki.pokexgames.com/images/f/fd/Squirtle_Red_Ninja_Pack_Direita.png'   // Lado Direito
                             { url: 'https://wiki.pokexgames.com/images/f/fd/Squirtle_Red_Ninja_Pack_Direita.png', width: 30 }  // Lado Direito
                         ]
                         ]
                     }
                     }
Linha 181: Linha 179:
                 imagesHtml += `
                 imagesHtml += `
                     <div class="variation-item">
                     <div class="variation-item">
                         <img src="${variation.additionalImages[0]}" alt="Variation Image" class="variation-image" data-variation-index="${index}">
                         <img src="${variation.additionalImages[0].url}" alt="Variation Image" class="variation-image" data-variation-index="${index}" style="width: ${variation.additionalImages[0].width}px;">
                          <div class="swap-button" data-variation-index="${index}"></div>
                        <div class="swap-button" data-variation-index="${index}"></div>
                         <div class="image-info">
                         <div class="image-info">
                             <b>Nome do Addon</b>: ${variation.description}  
                             <b>Nome do Addon</b>: ${variation.description}  
Linha 207: Linha 205:
                     currentImageIndex = (currentImageIndex + 1) % variation.additionalImages.length;
                     currentImageIndex = (currentImageIndex + 1) % variation.additionalImages.length;
                     const variationImage = button.previousElementSibling;
                     const variationImage = button.previousElementSibling;
                     variationImage.src = variation.additionalImages[currentImageIndex];
                     variationImage.src = variation.additionalImages[currentImageIndex].url;
                    variationImage.style.width = `${variation.additionalImages[currentImageIndex].width}px`;
                 });
                 });
             });
             });
5 667

edições

Menu de navegação