Cherche script pour menu déroulant

Fermé
pampelline Messages postés 144 Date d'inscription samedi 29 juillet 2006 Statut Membre Dernière intervention 18 avril 2024 - 30 janv. 2023 à 19:41
pampelline Messages postés 144 Date d'inscription samedi 29 juillet 2006 Statut Membre Dernière intervention 18 avril 2024 - 1 févr. 2023 à 14:55

Bonjour,  je voudrais a partir de ces menus html, touver un script, pour faire le menu déroulant , sachant que je ne peux maitriser que le langage htlm, voici le modéle du site
site
merci par avance pour vos réponses

" <div class="col-xl-7 col-lg-7 col-md-9 col-sm-9"> <nav class="navigation navbar navbar-expand-md navbar-dark "> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample04" aria-controls="navbarsExample04" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarsExample04"> <ul class="navbar-nav mr-auto"> <li class="nav-item "> <a class="nav-link" href="index.html">Accueil</a> </li> <li class="nav-item active"> <a class="nav-link" href="quisuisje.html">Qui suis je</a> </li> <li class="nav-item"> <a class="nav-link" href="techniques.html">Techniques</a> <div class="dropdown"> </li> <li class="nav-item"> <a class="nav-link" href="baraongle.html">Le bar a ongles</a> </li> <li class="nav-item"> <a class="nav-link" href="tarifs.html">Tarifs</a> </li> <li class="nav-item"> <a class="nav-link" href="contact.html">Contact</a> </li> </ul> </div> </nav> </div> "


Windows / Chrome 109.0.0.0


A voir également:

4 réponses

Bonjour pampelline !

Si comme vous le mentionnez, vous avez des difficultés avec le langage JavaScript, ce que je peux vous conseiller c'est d'utiliser des librairies déjà prévues pour ce que vous voulez faire dans vos projets plus "concrets".

Rien ne vous empêche de vous former sur le JavaScript, au contraire si vous souhaitez progresser dans le milieu de développement Web frontend c'est même très conseillé ! Pour cela, vous avez beaucoup de cours sur Internet et de documentations très bien faites.

Bon maintenant, voyons votre demande !

Vous nous avez mis un extrait de code HTML où vous souhaitez faire une barre de navigation. Je me suis permise de corriger certaines parties de votre code pour qu'il soit plus conventionnel. Comme dit plus haut, à défaut de vous mettre du code JavaScript pour effectuer ce que vous souhaitez, j'ai utiliser des librairies notamment Bootstrap et JQuery (si vous ne les connaissez pas, je vous invite à aller y jeter un coup d’œil). Ceci est, selon moi, dans un premier temps, la meilleure solution plutôt que de vous envoyer un code JavaScript que vous n'arriverez pas facilement à comprendre.

Voici à présent votre code corrigé :

 

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!-- CDN du fichier CSS de Bootstrap (vous pouvez le retirer si vous souhaitez travailler avec une autre librairie ou votre propre feuille de styles -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

    <!-- CDN de JQuery-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <!-- CDN du fichier JS de Bootstrap (utile) -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>
<div class="col-xl-7 col-lg-7 col-md-9 col-sm-9">
    <nav class="navigation navbar navbar-expand-md navbar-dark ">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample04"
                aria-controls="navbarsExample04" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarsExample04">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item ">
                    <a class="nav-link" href="index.html">Accueil</a>
                </li>
                <li class="nav-item active">
                    <a class="nav-link" href="quisuisje.html">Qui suis je</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="baraongle.html">Le bar a ongles</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="tarifs.html">Tarifs</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="contact.html">Contact</a>
                </li>
                <li class="nav-item dropdown">
                    <a class="dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"
                       aria-haspopup="true" aria-expanded="false">
                        Techniques
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">

                        <!-- Ajoutez les éléments de la liste déroulante ici -->

                    </div>
                </li>
            </ul>
        </div>
    </nav>
</div>
</body>
</html>

Ajoutez donc simplement les éléments que vous souhaitez inclure dans votre liste déroulante à l'endroit où mon commentaire l'indique. Notez que vous devrez très certainement ajouter du style CSS à votre barre de navigation.

Enfin, je souhaiterai ajouter qu'utiliser des CDN (Content Delivery Network) n'est pas forcément la meilleure pratique étant donné que ce sont des éléments hébergés à distance et que la disponibilité de ces éléments ne peut pas être assurée de manière fiable (j'ai utilisé les CDN uniquement dans le cadre de l'exemple).
Il est donc plus sécurisé et conventionnel de télécharger ces ressources en local sur votre machine.

J'espère que cela vous conviendra ! Si vous avez d'autres questions, n'hésitez pas !

0
pampelline Messages postés 144 Date d'inscription samedi 29 juillet 2006 Statut Membre Dernière intervention 18 avril 2024 21
Modifié le 31 janv. 2023 à 09:36

Bonjour, merci pour votre réponse, mais je ni arrive pas

je ne comprend pas ce que je dois remplacer dans mon script , et je veux le menu déroulant pareil , noir comme sur le site

pour mon site, suis en train de récupérer mes 10 go de page perso free pour l'héberger, je n 'ai plus le mot de passe de l'email, a moins que je le mettent dans l'hébergeur ovh, au quel mon nom de domaine est rattacher


0

D'après ce que je vois, vous souhaitez partir d'un thème déjà existant.

Il sera donc difficile de vous donner un exemple de code qui pourra s'adapter à vos besoin en ayant uniquement pour exemple ce thème.

Pour vous aider, il va donc me falloir les éléments suivants :
 

1) Le code de la barre de navigation que vous avez déjà implémenté dans votre projet.

Pour plus de lisibilité, merci de présenter votre code avec la mise en forme adaptée du forum. Pour faire cela, dans la zone de texte prévue pour écrire votre message, cliquez sur l'outil le plus à droite (à côté du logo d'insertion d'images). Dans la boîte de dialogue, sélectionnez le langage pour la colorisation syntaxique (HTML dans votre cas) et collez votre code dans la grande zone de texte en dessous avant de valider. Si vous souhaitez à nouveau modifier votre code, double-cliquez sur le rendu de votre code dans votre message.


2) Si vous souhaitez absolument du code JavaScript natif au lieu d'une librairie JavaScript comme proposée dans mon premier message.


3) La façon dont vous souhaitez que votre menu déroulant fonctionne et se présente (sous la forme d'un menu hamburger avec une boîte de dialogue contenant vos liens secondaires...).


4) Sur quel élément de votre barre de navigation vous souhaitez ajouter cette fonctionnalité ou si vous souhaitez que le menu déroulant s'affiche pour proposer une vue de votre barre de navigation dans le cadre d'une vue dite "responsive" (adaptation pour la vue mobile).
 


Pour vous proposer une solution, il me faut plus de contexte et d'informations sur ce que vous avez déjà essayé, sur ce que vous avez fait et sur vos attentes.

0
pampelline Messages postés 144 Date d'inscription samedi 29 juillet 2006 Statut Membre Dernière intervention 18 avril 2024 21
1 févr. 2023 à 14:55

Bonjour, on ma piratée l'adresse mail, que j'utilisée, pour me connecter a mon hébergeur , ou, j'ai mon nom de domaine, je suis en train d'en changer, est OVH, doit me contacter, pour verifier mon identité,

la j'ai un ancien site, que je veux changer, par le nouveaux modele

je reviendrais vers vous, quand je me serais dépatouillée de tout cela

merci encore pour vos réponses, aussi rapide


0