2009-07-11 3 views
0

J'ai un petit problème de conception.Définir le problème d'opacité de l'image

Sur this page J'ai quelques images de survol de la souris. Comme vous pouvez le voir (uniquement dans IE), les images sont entourées de noir lors de la définition de l'opacité.

Je n'ai pas ce problème dans firefox.

La raison pour laquelle j'utilise l'opacité, c'est parce que lorsque j'utilise hide/show l'image, la table où elle réside devient instable.

Quelqu'un peut-il aider à résoudre ce problème?

Merci, Richard

+0

Si vous trouvez ma réponse comme correcte, vous pouvez le marquer comme une réponse, de sorte que d'autres utilisateurs face au même problème peut savoir (et je peux obtenir quelques points de rep supplémentaires :)) – Kirtan

Répondre

2

C'est tout à fait un hack que vous utilisez. Idéalement, vous devez masquer/afficher les images sur mouseover/mouseOut comme celui-ci -

document.getElementById("imageId").style.display = "none"; //Hide 
document.getElementById("imageId").style.display = ""; //Show 

Si cela rend votre table fragile, alors il doit y avoir un problème avec la structure de la table que vous utilisez sur votre page (je ne vois aucun problème dans la structure de la table sur the page tho).

Pour contourner ce problème, vous pouvez également utiliser la classe visibility comme celui-ci (au lieu d'utiliser display) -

document.getElementById("imageId").style.visibility = "hidden"; //Hide 
document.getElementById("imageId").style.visibility = "visible"; //Show 
+0

merci beaucoup, cela a fonctionné – Richard

+0

lorsque vous voulez montrer que vous devez définir l'affichage = 'bloquer' –

+0

Dave, que ce soit pour définir la valeur de la propriété "display" à "" ou "block" dépend si l'élément a été affiché en mode bloc ou non avant d'être caché. Si elle n'était pas affichée comme un élément "block", et que vous définissiez ensuite la propriété "display" sur "block", il PEUT gâcher la mise en page en FF (j'ai vu quelques cas). – Kirtan

Questions connexes