Forum d'entraide PHPFrance

bonsoir

J'essaie de bidouiller un menu avec des parties factices et je galère un peu (voire même beaucoup !). Pourriez-vous me donner des pistes pour y arriver , svp ? Merci d'avance

J'ai trouvé dans le tuto de matéo une option qui permet d'afficher une infobulle sur un lien. Du coup je me suis demandé si on pouvais faire pareil mais sur un simple texte (affiché par echo)... je sais c'est tordu mais ça me permet de contourner la difficulté du "lien qui ne change pas de page mais qui affiche une autre fenêtre avec un message d'erreur au dessus de celle qu'on affiche avant que le mec ai cliqué sur le lien" (vous voyez de quoi je parle ?).

Je n'ai pas de code à vous montrer vu que le peu que j'ai essayé ne fonctionne pas , mais alors pas du tout ! merci quand même pour vos réponses.
Bonne soirée à vous tous

Bonjour,
L'idée est simpa.

Tu as soit une possibilité en css avec les z-index / position relative.
Soit les plug in Javascript.

Bon codage.

Merci Schim59

Mon but était à l'origine d'éviter d'utiliser le javascript, au moins pour faire la structure générale du site. Je risque d'en avoir besoin plus tard pour une partie de mon contenu mais je verrais ça en temps et en heure. Pour l'instant, j'essaie de me faire un site basique et j'avoue qu'entre le html, le css et le php, j'en ai déjà largement assez pour m'embrouiller !

Pour ton idée de css avec les z-index, je vais tenter. Je sais que j'ai vu ça dans l'un des tuto de matéo (si ma mémoire est bonne, dans celui sur le html/css) donc je devrais y arriver. je vous tiendrais au courant !

Encore merci pour ta réponse.

Le rendu est pas génial et peut surement être amélioré.
Bon codage.

#texte_base:hover{
	
	position: relative;
	width:800px;
	height:50px;
}

#texte_base{
		width:800px;
	height:50px;
cursor:pointer;
	position:absolute;z-index:-450;
}

#infobulle{
background:#E5DE82;
position:absolute;
margin-left:440px;
margin-top:-50px;
	-moz-box-shadow: 8px 8px 12px #aaa;
	-webkit-box-shadow: 8px 8px 12px #aaa;
	-khtml-box-shadow: 8px 8px 12px #aaa;
	box-shadow: 8px 8px 12px #555;
}

<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
	<LINK rel=stylesheet type="text/css" href="infobulle.css">
	<title>Info bulle v1</title>
</head>

<body>
<div id="texte_base">Je suis un texte qui declenche une infobulle au passage de la souris !</div>
<div id="infobulle">Je suis un une infobulle en CSS!</div>
</body>
</html>

Si ton infobulle ne contient pas de code html mais uniquement du texte, tu peux utiliser l'attribut title sur certaines balises. Les navigateurs vont interpréter pour afficher une petite infobulle standard (tu peux voir le résultat quand tu postes un messages si tu passes ta souris sur les smileys ou sur les balises php, sql, ...) Regarde le code source pour d'info

Sinon, pour des infobulles un peu plus complexes (avec du html, ou un style particulier si tu veux une couleur de fond, une largeur différente, ...), ta solution en css peut convenir

Bonjour !
Un grand merci à Ryle et à Schim59 pour vos réponses.

Finalement, j'ai opté pour la solution "title" (la fameuse option dont je parlais dans mon premier message et dont j'avais un peu oublié le nom. Merci Ryle !).

Schim59 : ta solution est certainement très bien aussi, sauf que la disposition des differentes parties de mon site se fait par display : inline-block et que, du coup, les position relative ou absolue au milieu, j'ai eu un peu de mal. J'avoue que je n'avais pas envie de me prendre la tête la dessus pendant une semaine "au cas où un petit malin aurait eu envie de voir s'il ne pouvait pas acceder à la partie privé du site" (parce qu'à l'origine, le menu_factice c'etait pour ça !). Donc j'ai choisi la solution la plus simple et la plus rapide à mettre en place.

Si ça interesse quelqu'un, je vous met les codes
Celui de mon menu avec parties factices :

 <nav class="nav_menu_top1">
<ul>
<li><a href="accueil.php"><?php echo text_accueil; ?></a></li>
<li> <!-- ça c'est un vrai "bouton" qui redirige vers une autre page. -->
<div class="a_factice" title="<?php echo text_reserve ;?>"><?php echo text_esp_membre ;?></div> </li>  <!-- ça c'est un faux bouton qui ne fait rien du tout sauf l'affichage d'un petit cadre "réservé" -->
</ul>
</nav>

On peut ajouter des boutons autant qu'on veut. Faut juste choisir entre le modèle <a href""...> ou <div class="a_factice">

et le css qui va avec : (qui peut bien sûr être amélioré)

 /* le menu_top1 */

.nav_menu_top1 ul {
 padding:0;
 margin:0;
 list-style-type:none;
 }
.nav_menu_top1 li {
 margin-left:2px;
 float:left; /*pour IE*/
 }
.nav_menu_top1 ul li a {

 display:block;
 float:left;   
 width:100px;
 background-color:#6495ED;
 color:black;
 text-decoration:none;
 text-align:center;
 padding:5px;
 border:2px solid;
 /*pour avoir un effet "outset" avec IE :*/
 border-color:#DCDCDC #696969 #696969 #DCDCDC;
 }
.nav_menu_top1 ul li  a:hover {
 background-color:#D3D3D3;
 border-color:#696969 #DCDCDC #DCDCDC #696969;
 } 
 
 .nav_menu_top1 ul li .a_factice {

 display:block;
 float:left;   
 width:100px;
 background-color:#6495ED;
 color:black;
 text-decoration:none;
 text-align:center;
 padding:5px;
 border:2px solid;
 /*pour avoir un effet "outset" avec IE :*/
 border-color:#DCDCDC #696969 #696969 #DCDCDC;
 }
.nav_menu_top1 ul li  .a_factice:hover {
 background-color:#D3D3D3;
 border-color:#696969 #DCDCDC #DCDCDC #696969;
 }

Sachant quand même que si vous faites un simple copier/coller, ça ne fonctionnera pas chez vous. Il faut changer les <?php echo text_xxx; ?> par des echo simples ou carrément, si vous n'avez pas un besoin vital d'utiliser echo, les remplacer par du texte normal.
Dans mon code, j'ai fait des echo text_xxx car le site est multi-langue et ça permet de changer automatiquement la langue du texte a afficher selon la langue que parle le visiteur (sauf que ça fait référence à 2 autres fichiers dont je ne vous ai pas donné les codes). Pour ceux que le sujet du multi-langue interesse , voir ici :http://phpdebutant.org/article107.php.

Bon week-end à tous !

Il y a <th tittle="text info bulle"> aussi, Coment n'y ai je pas pensé !!! hontes a moi.
JE vais donc le copier 100 fois.

Par contre la bulle n'apparait pas toujours tout de suite chez moi. Defois il faut rebouger la souris.

<div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule"><div title="texte_base_infobule">

100fois oui oui vous pouvez recompter.

100fois oui oui vous pouvez recompter.

Moi j'en compte que 92...

Forum d'entraide PHPFrance

[RESOLU] un echo avec infobulle : possible ou pas ?

un echo avec infobulle : possible ou pas ?

Re: un echo avec infobulle : possible ou pas ?

Re: un echo avec infobulle : possible ou pas ?

Re: un echo avec infobulle : possible ou pas ?

Re: un echo avec infobulle : possible ou pas ?

Re: un echo avec infobulle : possible ou pas ?

Re: [RESOLU] un echo avec infobulle : possible ou pas ?

Re: [RESOLU] un echo avec infobulle : possible ou pas ?