Problème de visualisation sous IE avec une infobulle

Question

Bonjour,

Tout d'abord je suis toute nouvelle sur le forum alors n'hésitez pas à me dire si je me trompe ou fait mal mes demandes. Alors voilà mon soucis depuis un petit moment...Sur mon site j'ai une page ou j'ai mis une infobulle pour qu'au passage de la souris les images miniatures s'agrandissent. Mais voilà j'ai déjà eu un mal fou sous IE pour qu'il n'y ai pas de bug et maintenant que j'ai réussi et bien je n'ai que ma première image miniature qui ne veut pas se mettre en fonction. En fait j'ai les écritures qui se voient sur ma page lol et je n'arrive pas à trouver le moyen de les enlever. Auriez vous une solution à mon problème? Me suis-je suffisament bien expliquer?
Je vous remercie à l'avance pour l'aide précieuse que vous m'apporterez.
Cordialement,
Mylène

@karamel · Answer

bonjour

sans code on ne peut rien faire

Zobibol · Answer

Bien le bonjour, comme ça, d'après le descriptif et surtout cette petite phrase :"En fait j'ai les écritures qui se voient sur ma page lol et je n'arrive pas à trouver le moyen de les enlever", ça ressemble beaucoup à une erreur du genre: balise non fermée, guillemet non fermé enfin un truc pas fermé, mais comme le souligne à juste titre Kazma, sans code, ça va être rude de trouver le pourquoi du comment.



[o-_-o]

cs_mylene38 · Answer

Merci beaucoup pour l'info je ne savais pas si on avait le droit et bien à présent je sais Pär juste un truc pff depuis que j'ai éris mon mail tout à l'heure je n'arrive plus à visionner mes images en agrandissements lol je suis maudite ! Enfin voici ma page complète vous me direz ce qu'il ne va pas j'ai du commettre des erreurs ce n'est pas possible autrement. Papier A Lettre Paques Mes papiers à lettre de pâques onmouseover="showTooltip(' Paques1 Création la Boutique Virtuelle d Agnes ');" > [# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ][# ] Merci à l'avance. Mylène

Zobibol · Answer

Ah bah ça va un peu mieux avec du code.
l'erreur semble provenir ici:

Mes papiers à lettre de pâques


onmouseover="showTooltip('
Paques1
Création la Boutique Virtuelle d Agnes

');"
>



il manque l'entête de du lien (a): 

et la, du coup ça marche un peu mieux.
il serait bon de rajouter les "alt" sur les diverses images.


[o-_-o]

cs_mylene38 · Answer

Coucou c'est encore moiAlors merci beaucoup Zobibol c'eset ok pour  je n'ai plus les écritures. Par contre tu lme parles de mettre des alts à chaque image ou je le place? J'ai fais des tests mais sans succès...je suis pas très expérimentée alors je n'ai pas dû le mettre correctement. Et peux tu me dire à quoi sert le atl en html? Je suis très curieuse et j'aime apprendre alors désolée pour toutes ses questions.
Mylène

Zobibol · Answer

Re-bonjour, après une bonne nuit de presque sommeil.
Alors d'une part, de rien, ce genre de soucis arrive même aux meilleurs.
Ensuite l'attribut alt est un attribut de la balise img (il me semble si je ne m'abuse qu'il est obligatoire (voire très vivement conseillé)).
Dedans, il suffit d'y placer une chaine ie:

du coup comme l'image n'existe pas le browser affichera la valeur de alt. ce qui n'est pas un luxe.

ici un bon site qui pourrait t'aider.



[o-_-o]

BunoCS · Answer

Bonjour,
ce qui n'est pas un luxe.
Je dirais même que c'est recommandé pour des raisons d'accessibilité. Une personne mal-voyante utilise un outil qui lui "lira" la page web et qui utilise les attributs alt des images

@+
Buno
----------------------------------------
L'urgent est fait, l'impossible est en cours. Pour les miracles, prévoir un délai...

cs_mylene38 · Answer

Re-bonjour,

Alors, j'ai positionné mes alt avec chaque image comme ceci 
Mes papiers à lettre de pâques

[# 
]<a href="#"
j'espère que j'ai bien appris ma leçon et effectivement maintenant on peu lire le nom de l'image lorsque la souris passe dessus

J'aurai une autre requetteconcernant la visibilité des mes images sous IE elles ne sont toujours pas visibles en grands lorsque je passe la souris dessus  Pourtant j'ai utilisé un code qui soit disant annuler ce genre de bug. Si vous avez une soluce je suis preneuse !!! Et merci encore c'est vraiment très gentil à vous de m'aider c'est très apprécié.
Très bon jeudi 
Mylène

Zobibol · Answer

Concernant le problème sur ie, il va falloir fournir les sources de "infobulle.js". 
Plusieurs pistes peuvent être néanmoins explorées: la taille des images "large", le chemin d'accès de celles-ci (il faut bien respecter la casse).
Concernant le problème (quasi résolu) de alt, il faut lui préciser une valeur (ce qui d'ailleurs pourrait permettre d'avoir des infos en plus sur les images zoomer avec ie.).

Du coup on va se mettre en attente d'info.



[o-_-o]

cs_mylene38 · Answer

Alors tout d'abord concernant mon "infobulle.js" voici les sources :
var xOffset=6
var yOffset=5

var affiche = false; // La variable i nous dit si le bloc est visible ou non
var w3c=document.getElementById && !document.all;
var ie=document.all;

if (ie||w3c) {
var laBulle
}

function ietruebody(){ // retourne le bon corps...
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function deplacer(e) {
if(affiche){
var curX = (w3c) ? e.pageX : event.x + ietruebody().scrollLeft;
var curY = (w3c) ? e.pageY : event.y + ietruebody().scrollTop;

var winwidth = ie && !window.opera ? ietruebody().clientWidth : window.innerWidth - 20;
var winheight = ie && !window.opera ? ietruebody().clientHeight : window.innerHeight - 20;

var rightedge = ie && !window.opera ? winwidth - event.clientX - xOffset : winwidth - e.clientX - xOffset;
var bottomedge = ie && !window.opera ? winheight - event.clientY - yOffset : winheight - e.clientY - yOffset;

var leftedge = (xOffset < 0) ? xOffset*(-1) : -1000

// modifier la largeur de l'objet s'il est trop grand...
if(laBulle.offsetWidth > winwidth / 3){
laBulle.style.width = winwidth / 3
}

// si la largeur horizontale n'est pas assez grande pour l'info bulle
if(rightedge < laBulle.offsetWidth){
// bouge la position horizontale de sa largeur à gauche
laBulle.style.left = curX - laBulle.offsetWidth + "px"
} else {
if(curX < leftedge){
laBulle.style.left = "5px"
} else{
// la position horizontale de la souris
laBulle.style.left = curX + xOffset + "px"
}
}

// même chose avec la verticale
if(bottomedge < laBulle.offsetHeight){
laBulle.style.top = curY - laBulle.offsetHeight - yOffset + "px"
} else {
laBulle.style.top = curY + yOffset + "px"
}
}
}
function showTooltip(text) {
if (w3c||ie){
laBulle = document.all ? document.all["bulle"] : document.getElementById ? document.getElementById("bulle") : ""
laBulle.innerHTML = text; // fixe le texte dans l'infobulle
laBulle.style.visibility = "visible"; // Si il est cachée (la verif n'est qu'une securité) on le rend visible.
affiche = true;
}
}
function hideTooltip() {
if (w3c||ie){
affiche = false
laBulle.style.visibility="hidden" // avoid the IE6 cache optimisation with hidden blocks
laBulle.style.top = '-100000px'
laBulle.style.backgroundColor = ''
laBulle.style.width = ''
}
}

document.onmousemove = deplacer; // des que la souris bouge, on appelle la fonction move pour mettre a jour la position de la bulle.

Pour l'histoire de alt sur mes images tu parles de mettre des valeurs alors j'ai cherché ce que c'était lol mais si je mets un complement d'information ça fait tout faussé dans ma page Je suis désolée de t'embêter avec tout ça c'est vraiment pas facile quand on y connait pas grand chose.
Mylène

@karamel · Answer

le script que tu nous donne c'est pas la joie il faut avouer qu'il est mal fait le mieux serait un lien vers la page afin de mieux cerné le problème

Problème de visualisation sous IE avec une infobulle

11 réponses

Votre réponse

Discussions similaires