Popup sur plisieurs lignes
Résolu/Fermé
heliconius
Messages postés
545
Date d'inscription
mardi 1 juillet 2008
Statut
Membre
Dernière intervention
23 juin 2023
-
12 avril 2014 à 01:44
heliconius Messages postés 545 Date d'inscription mardi 1 juillet 2008 Statut Membre Dernière intervention 23 juin 2023 - 14 avril 2014 à 00:27
heliconius Messages postés 545 Date d'inscription mardi 1 juillet 2008 Statut Membre Dernière intervention 23 juin 2023 - 14 avril 2014 à 00:27
A voir également:
- Popup sur plisieurs lignes
- Comment aller à la ligne sur excel - Guide
- Ne pas apparaître en ligne sur instagram - Guide
- Chaque fichier en ligne sur le web a un chemin d’accès sur un serveur. c’est le cas du fichier du logo présent sur la page de cette ville. quel est le chemin de ce fichier à partir de la racine du site ? - Forum Graphisme
- Excel trier par ordre alphabétique en gardant les lignes - Guide
- Afficher toutes les lignes masquées excel ✓ - Forum Excel
4 réponses
Bonjour,
houlà il y a pas mal de confusion...
Qu'est ce que vous appelez un pop up? En français ça s'appellerait une fenêtre surgissant, c'est une nouvelle page qui s'affiche au dessus d'une autre(d'où le pop et le up).
La balise acronym est utilisé(comme son nom l'indique) pour indiquer un acronyme et n'est plus valable en HTML5 comme indiqué dans par les normes du W3C:
http://www.w3schools.com/tags/tag_acronym.asp
A remplacer par abbr donc.
\n pour un saut à la ligne? c'est le cas dans certains langage de programmation (n=new pour new line) mais absolument pas en HTML...
Pour les saut à la ligne en html il faut utiliser la balise <br/>.
Si vous n'arrivez pas à indiquer le texte d'une infobulle comme vous le souhaitez avec acronym(ou plus judicieusement abbr) avec l'attribut title c'est simplement que ce n'est pas fait pour ça.
L'attribut title en HTML:
http://www.w3schools.com/tags/att_global_title.asp
Qui fait apparaître clairement que c'est un élément sémantique(structure du langage, méta informations à et non un élément d'affichage.
A vous de déterminer si vous voulez un élément visuel (donc css)ou un élément structurel sémantique(html) ou les 2 mais n'essayez pas d'utiliser l'un pour l'autre car:
L'affichage ne sera pas correct ni l'information juste.
Cela s'appelle une erreur et il y a de forts risque que ça ne marche pas car non seulement vous ne respectez pas les normes(ce qui n'est pas si grave) mais vous allez dans le sens contraire de celles ci.
.
Vous forcez quelque chose qui n'est pas fait pour et obliger l'utilisateur(son navigateur mais le rendu qui en découle) à s'adapter hors c'est l'inverse qui doit être fait: proposer une utilisation standard et le plus large et ouverte possible.
Pour l'aspect visuel:
https://www.google.fr/search?q=infobulle+css
En mettant le texte abrégé dans la balise abbr bien sûr.
Ou pour faire un pop up(une nouvelle fenêtre de navigation):
https://www.google.fr/search?q=pop+up+javascript
houlà il y a pas mal de confusion...
Qu'est ce que vous appelez un pop up? En français ça s'appellerait une fenêtre surgissant, c'est une nouvelle page qui s'affiche au dessus d'une autre(d'où le pop et le up).
La balise acronym est utilisé(comme son nom l'indique) pour indiquer un acronyme et n'est plus valable en HTML5 comme indiqué dans par les normes du W3C:
http://www.w3schools.com/tags/tag_acronym.asp
A remplacer par abbr donc.
\n pour un saut à la ligne? c'est le cas dans certains langage de programmation (n=new pour new line) mais absolument pas en HTML...
Pour les saut à la ligne en html il faut utiliser la balise <br/>.
Si vous n'arrivez pas à indiquer le texte d'une infobulle comme vous le souhaitez avec acronym(ou plus judicieusement abbr) avec l'attribut title c'est simplement que ce n'est pas fait pour ça.
L'attribut title en HTML:
http://www.w3schools.com/tags/att_global_title.asp
Qui fait apparaître clairement que c'est un élément sémantique(structure du langage, méta informations à et non un élément d'affichage.
A vous de déterminer si vous voulez un élément visuel (donc css)ou un élément structurel sémantique(html) ou les 2 mais n'essayez pas d'utiliser l'un pour l'autre car:
L'affichage ne sera pas correct ni l'information juste.
Cela s'appelle une erreur et il y a de forts risque que ça ne marche pas car non seulement vous ne respectez pas les normes(ce qui n'est pas si grave) mais vous allez dans le sens contraire de celles ci.
.
Vous forcez quelque chose qui n'est pas fait pour et obliger l'utilisateur(son navigateur mais le rendu qui en découle) à s'adapter hors c'est l'inverse qui doit être fait: proposer une utilisation standard et le plus large et ouverte possible.
Pour l'aspect visuel:
https://www.google.fr/search?q=infobulle+css
En mettant le texte abrégé dans la balise abbr bien sûr.
Ou pour faire un pop up(une nouvelle fenêtre de navigation):
https://www.google.fr/search?q=pop+up+javascript
Utilisateur anonyme
12 avril 2014 à 08:18
12 avril 2014 à 08:18
salut, je pense que tu dois créer toi même tes propres infobulle.
heliconius
Messages postés
545
Date d'inscription
mardi 1 juillet 2008
Statut
Membre
Dernière intervention
23 juin 2023
137
13 avril 2014 à 14:48
13 avril 2014 à 14:48
Merci beaucoup Alko pour cette réponse complète et détaillée. Il y a effectivement eu de ma part mauvaise utilisation des termes convenables.
En fait, il s'agit d'une infobulle. L'objectif est d'aider le visiteur à remplir correctement un formulaire. Derrière chaque champ de saisie, il y aurait soit un point d'interrogation soit une petite image (un i dans un cercle) pour indiquer qu'au clic ou de préférence au survol, une information supplémentaire sera affichée en infobulle.
Certains textes d'aide peuvent être courts ("Saisissez le nom de famille") mais d'autres pourraient être beaucoup plus longs que la largeur de l'écran, d'où l'envie de faire tenir un texte sur plusieurs lignes. Comme tu l'as dit, le \n ne marche pas mais le <br/> non plus. D'où ma question sur ce forum.
Si j'ai bien compris, la balise à utiliser serait abbr et il me resterait à chercher sur le net "infobulle en CSS". C'est bien cela ?
En fait, il s'agit d'une infobulle. L'objectif est d'aider le visiteur à remplir correctement un formulaire. Derrière chaque champ de saisie, il y aurait soit un point d'interrogation soit une petite image (un i dans un cercle) pour indiquer qu'au clic ou de préférence au survol, une information supplémentaire sera affichée en infobulle.
Certains textes d'aide peuvent être courts ("Saisissez le nom de famille") mais d'autres pourraient être beaucoup plus longs que la largeur de l'écran, d'où l'envie de faire tenir un texte sur plusieurs lignes. Comme tu l'as dit, le \n ne marche pas mais le <br/> non plus. D'où ma question sur ce forum.
Si j'ai bien compris, la balise à utiliser serait abbr et il me resterait à chercher sur le net "infobulle en CSS". C'est bien cela ?
heliconius
Messages postés
545
Date d'inscription
mardi 1 juillet 2008
Statut
Membre
Dernière intervention
23 juin 2023
137
14 avril 2014 à 00:27
14 avril 2014 à 00:27
Merci c'était effectivement cela. Voilà la solution trouvée :
... etc ...
... etc ...
Merci donc à tous.
Sujet clos.
<style type="text/css">
a.info {
position:relative;
z-index:24;
color:#000000;
text-decoration:none
}
a.info:hover {
z-index:25;
background-color:#FFFFA0;
}
a.info span {
display:none
}
a.info:hover span {
display:block;
position:absolute;
top:2em; left:2em; width:20em;
border:1px solid #000000;
border-radius:5px;
background-color:#FFFFA0;
color:#000000;
text-align:left
font-weight:none;
padding:5px;
}
</style>
... etc ...
<tr>
<td>Adresse mail</td>
<td><input type="text" name="mail" size="50">
<a class="info" href="#">
<img src="img/icone-i_24px.jpg" border="0">
<span>Indiquez l'adresse mail pour laquelle vous souhaitez
faire signer la clef publique. S'il y a plusieurs adresses
mail qui correspondent à celle-ci, mentionnez l'adresse
mail principale.</span>
</a>
</td>
</tr>
... etc ...
Merci donc à tous.
Sujet clos.
