Bouton qui descend en dessous du menu et fait partie de la barre
Résolu/Fermé
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
-
23 déc. 2014 à 12:22
guedo Messages postés 77 Date d'inscription mercredi 26 novembre 2014 Statut Membre Dernière intervention 10 avril 2019 - 26 déc. 2014 à 09:39
guedo Messages postés 77 Date d'inscription mercredi 26 novembre 2014 Statut Membre Dernière intervention 10 avril 2019 - 26 déc. 2014 à 09:39
A voir également:
- Bouton qui descend en dessous du menu et fait partie de la barre
- Menu déroulant excel - Guide
- Windows 11 barre des taches a gauche - Guide
- Barre verticale mac - Forum MacOS
- Menu démarrer windows 11 - Guide
- Changer la couleur de la barre des taches - Guide
3 réponses
jordane45
Messages postés
38138
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
17 avril 2024
4 649
23 déc. 2014 à 12:54
23 déc. 2014 à 12:54
Bonjour,
Je ne comprend pas trop...
Ton bouton sera directement visible SOUS ton menu .. et contiendra une Liste déroulante ? Ou bien.. ton bouton sera SUR ton menu ( comme le menu "Bilan Thermique" ) ?
Quoi qu'il en soit.. si tu fais "pareil" que pour "Bilan Thermique" .. tu n'as qu'à copier son code et le modifier pour tes besoins...
Si c'est autre chose.... il va falloir le coder....
HTML + CSS ( et peut être un peu de Javascript..)
Première étape :
Nous montrer le code source du MENU existant
NB: Merci de bien vouloir utiliser la coloration syntaxique (les balises de code) lorsque tu postes du code sur le forum.
Explications disponibles ici :
https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
Deuxième étape : Nous indiquer très CLAIREMENT ce que tu souhaites obtenir...
- La position du bouton par rapport au menu
- A quel moment apprait il ? ( est il toujours visible ? )
- Ce qu'il contient ( lorsqu'on clique dessus.. qu'est ce qu'il affiche ??)
Je ne comprend pas trop...
Ton bouton sera directement visible SOUS ton menu .. et contiendra une Liste déroulante ? Ou bien.. ton bouton sera SUR ton menu ( comme le menu "Bilan Thermique" ) ?
Quoi qu'il en soit.. si tu fais "pareil" que pour "Bilan Thermique" .. tu n'as qu'à copier son code et le modifier pour tes besoins...
Si c'est autre chose.... il va falloir le coder....
HTML + CSS ( et peut être un peu de Javascript..)
Première étape :
Nous montrer le code source du MENU existant
NB: Merci de bien vouloir utiliser la coloration syntaxique (les balises de code) lorsque tu postes du code sur le forum.
Explications disponibles ici :
https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
Deuxième étape : Nous indiquer très CLAIREMENT ce que tu souhaites obtenir...
- La position du bouton par rapport au menu
- A quel moment apprait il ? ( est il toujours visible ? )
- Ce qu'il contient ( lorsqu'on clique dessus.. qu'est ce qu'il affiche ??)
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
1
Modifié par jordane45 le 23/12/2014 à 14:20
Modifié par jordane45 le 23/12/2014 à 14:20
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html">Power Eco France</a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav navbar-right"> <li> <a href="a propos.html">À propos</a> </li> <li> <a href="services.html">Services</a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Bilan thermique <b class="caret"></b></a> <ul class="dropdown-menu"> <li> <a href="bilan thermique.html">Bilan thermique</a> </li> <li> <a href="pourquoi.html">Pourquoi ?</a> </li> <li> <a href="comment.html">Comment ?</a> </li> </ul> </li> <li> <a href="rdv.html">Prendre un RDV</a> </li> <li> <a href="contact.html">Contact</a> </li> <li> <a href="faq.html">FAQ</a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Autres <b class="caret"></b></a> <ul class="dropdown-menu"> <li> <a href="structure.html">structure</a> </li> <li> <a href="tarifs.html">Tarifs</a> </li> <li> <a href="CODES/ADMIN/connexion.html"><span class="glyphicon glyphicon-user"></span></a> </li> </ul> </li> </ul> </div> <!-- /.navbar-collapse --> </div> <!-- /.container --> </nav>
j'aimerais en faite que le bouton se situe juste en dessous de ma barre de menu comme je l'ai indiquer sur la photo que j'ai postez, se sera une bouton unique de redirection vers une autre page sans menu déroulant.
j'espere que j'aurais ete le plus clair possible.
jordane45
Messages postés
38138
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
17 avril 2024
4 649
23 déc. 2014 à 14:32
23 déc. 2014 à 14:32
J'ai l'impression que tu utilises BootStrap pour gérer le CSS...
Dans ce cas.. tu n'aurais qu'à mettre un truc de ce genre ( après ton menu )
Puis à joueur sur le style/css (les col-*-offset) du premier DIV pour le positionner là où tu le souhaites
Dans ce cas.. tu n'aurais qu'à mettre un truc de ce genre ( après ton menu )
<div class="col-sm-2 col-lg-2 col-xs-2 col-xs-offset-0 col-md-offset-4 col-lg-offset-4 col-sm-offset-2"> <div class="btn-group btn-group-justified" aria-label="Justified button group" role="group"> <a class="btn btn-default" role="button" href="url_de_la_page_html"> Texte du bouton </a> </div> </div>
Puis à joueur sur le style/css (les col-*-offset) du premier DIV pour le positionner là où tu le souhaites
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
1
23 déc. 2014 à 14:40
23 déc. 2014 à 14:40
exactement merci je n'y avait pas du tout penser mais c'est exactement sa (c'est la reaction que l'on fait tous en voyant la reponse :p)
merci.
merci.
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
1
23 déc. 2014 à 14:43
23 déc. 2014 à 14:43
juste par contre je viens de le faire mais sa me cree une ligne speciale pour le bouton est ce que tu connait le code a mettre justement pour que le bouton soit supperposer en avant de la page (sa veut dire que mon bouton se retrouve sur les ecriture ou les photo de ma page au lieu que sa cree une ligne entiere que pour le bouton)
jordane45
Messages postés
38138
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
17 avril 2024
4 649
>
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
23 déc. 2014 à 15:00
23 déc. 2014 à 15:00
Je n'ai pas de Bootstrap sous la main pour tester..
Mais peut être qu'en ajoutant la class : navbar-fixed-top dans le premier DIV il devrait pouvoir se fixer (tout comme ton menu) en haut de la page (et donc rester visible même si tu descend dans ta page).
(( et donc... être au dessus.. du contenu.. ))
Mais peut être qu'en ajoutant la class : navbar-fixed-top dans le premier DIV il devrait pouvoir se fixer (tout comme ton menu) en haut de la page (et donc rester visible même si tu descend dans ta page).
(( et donc... être au dessus.. du contenu.. ))
guedo
Messages postés
77
Date d'inscription
mercredi 26 novembre 2014
Statut
Membre
Dernière intervention
10 avril 2019
1
24 déc. 2014 à 15:38
24 déc. 2014 à 15:38
rebonjour le probleme auquel je suis confronter maintenant c'est que quand je met le bouton sur la page le reste de la page descend en dessous du bouton au lieu de venir en dessous comme ceci (j'aimerais que l'image vienne en desous directement)
est ce que quelqu'un connait une solution sachant que j'ai deja essayé ceci mais sa ne fonctionne pas
est ce que quelqu'un connait une solution sachant que j'ai deja essayé ceci mais sa ne fonctionne pas
#plan1{
background-color: #ffffff;
width: 900px;
height: 636px;
margin-left: 325px;
z-index:0;
position: absolute;
}
#plan2{
background-color: #ffffff;
width: 900px;
height: 636px;
margin-left: 325px;
position: relative;
z-index:1;
}
Webhavo
Messages postés
25
Date d'inscription
mardi 11 novembre 2014
Statut
Membre
Dernière intervention
1 décembre 2015
1
25 déc. 2014 à 04:29
25 déc. 2014 à 04:29
Bonjour,
Enlève "position : relative;"
Cordialement
Enlève "position : relative;"
Cordialement