Bulle dans select trop long

lili_jazzy Messages postés 10 Date d'inscription mardi 21 novembre 2000 Statut Membre Dernière intervention 3 juillet 2009 - 11 juil. 2005 à 13:57
lili_jazzy Messages postés 10 Date d'inscription mardi 21 novembre 2000 Statut Membre Dernière intervention 3 juillet 2009 - 13 juil. 2005 à 09:53
bonour,
je souhaite afficher une info-bulle lors d'un click dans un item de liste de selection trop long. j'ai une iframe (bulle) et je récupère le y de l'endroit où j'ai cliqué. En suite je souhaite afficher le texte (texte) dans l'iframe j'ai essayé innerHTML mais cela ne marche pas.
Est-ce que quelqu'un pourrait m'aider s'il vous plait?
d'avance merci
laurence

<script>
function afficher(texte){
if(texte.length>10){
var bulle = document.getElementById('bulle');
bulle.style.top = event.clientY+document.body.scrollTop + 8;
bulle.style.visibility = 'visible';
}
else{
document.getElementById('bulle').style.visibility = 'hidden';
}
}
</script>
<select size="3" style="width:100px" onChange="afficher(this.value);">
<option value="text court">text court</option>
<option value="text moyen moyen moyen" >text moyen moyen moyen</option>
</select>


4 réponses

cs_bultez Messages postés 13616 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
12 juil. 2005 à 09:09
Bonjour,
il y avait quelques petites erreurs,
mais surtout, et je ne comprend pas
pourquoi, en utilisant bulle.document.body.innerHTML
ou des "choses" approchantes soit rien ne s'affiche,
soit le select disparait !!
en utilisant un div à la place de l'iframe, c'est
encore pire puisqu'il apparait en dessous du select
quoi que l'on fasse ( je crois que c'est un bug connu )

ci-dessous une possibilité donc.

<HTML>
<HEAD>
<TITLE></TITLE>
<script type="Text/JavaScript">
function afficher(texte)
{ var bul = document.getElementById('bulle');
if ( texte.length>10 )
{ //bul.style.top=event.x-32;//si on veut ou pas
bul.style.top=event.y-10;
bulle.document.body.innerHTML=texte;
bul.style.display = 'inline'; }
else { bul.style.display = 'none'; } }
</script>
</HEAD>

<select size="30"
style="width:100px"
onChange="afficher(this[this.selectedIndex].text);">
<option>text court</option>
<option>text moyen moyen moyen</option>
</select>
src="bidon.htm"
style=" position:absolute;
left:80px;
top:100px;
height:22px;
overflow:hidden;
display:none;">
</HTML>

la page "bidon.htm" :

<html>

</html>


Cordialement. Bul. ~Site~~[mailto:marcelBultez@tiscali.fr Mail]~
0
lili_jazzy Messages postés 10 Date d'inscription mardi 21 novembre 2000 Statut Membre Dernière intervention 3 juillet 2009
12 juil. 2005 à 10:58
bonjour
je vous remercie pour votre reponse mais il y a un petit pb
en utilisant body.innerHTML j'ai le texte en pleine page et non dans l'iframe à côté de la select même en utilisant src="bidon.html" !
0
cs_bultez Messages postés 13616 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
12 juil. 2005 à 11:15
tel que mon script est fait :
position horizontale fixe
//bul.style.top= event.x-32; en commantaires
style=" position:absolute;
left:80px;
top:100px;
position verticale = presque là où l'on clique
bul.style.top =event.y-10;
Ce qui est exclusif Internet Explorer d'ailleurs.
ça ne devrait donc pas être "en pleine page"
Cordialement. Bul. ~Site~~[mailto:marcelBultez@tiscali.fr Mail]~
0
lili_jazzy Messages postés 10 Date d'inscription mardi 21 novembre 2000 Statut Membre Dernière intervention 3 juillet 2009
13 juil. 2005 à 09:53
merci beaucoup ca fonciotnne bien!
0