Fonctionnement de la page d’accueil

Présentation

La page d’accueil du site SWGOH Wiki a été conçue pour être immersive et intuitive. Elle combine un fond vidéo, un sélecteur de langue (français/anglais) et deux sections principales : Personnages et Vaisseaux. C’est le point de départ vers le reste du contenu.

Vidéo de fond

La vidéo en arrière-plan est jouée en autoplay, sans son et en boucle pour créer une immersion visuelle dans l’univers Star Wars.

        <video autoplay muted loop>

          <source src="image/swgoh.mp4" type="video/mp4">

        </video>

Sélecteur de langue

Deux drapeaux permettent de basculer entre le français et l’anglais. Le contenu est traduit dynamiquement grâce à un objet JavaScript contenant toutes les traductions.

        const translations = {

          en: { title: "Star Wars galaxy of heroes website" },

          fr: { title: "Site Web Star Wars : Les Héros de la Galaxie" }

        };

La fonction switchLanguage() met à jour le texte des éléments HTML via leur attribut id.

Sections principales

Deux entrées sont proposées : Personnages et Vaisseaux. Elles redirigent respectivement vers les pages filtre-personnage.html et filtre-vaisseaux.html pour explorer les unités.

        <div class="main-sections">

          <div class="section">

            <h3 id="Character">Character</h3>

            <a href="filtre-recherche/filtre-personnage.html" id="voir-perso">Character</a>

          </div>

          <div class="section">

            <h3 id="ship">Ship</h3>

            <a href="filtre-recherche/filtre-vaisseaux.html" id="voir-vaisseau">Ship</a>

          </div>

        </div>

⬅ Retour au projet