OnMouseOver fonctionne mais la petite vignette reste seulement en X rouge - comment montrer le pouce?

Question

J'utilise ce qui suit pour que les visiteurs du site puissent cliquer sur une vignette (dans ce cas, il s'appelle tn_guinness-label.jpg) et quand ils cliquent, une image plus grande apparaît (dans ce cas, guinness-label.jpg) . Alors ... Je l'ai essayé et tout ce que je pouvais voir était une petite boîte avec un X rouge à l'intérieur, et quand j'ai passé ma souris sur le X rouge, ça a marché comme il se doit et m'a montré l'image plus grande. Pourquoi ne m'a-t-il pas montré la vignette avant que je fasse un survol de la souris? De plus, après avoir terminé le survol de la souris et ensuite enlevé la souris, j'ai pu voir la vignette, qui est restée visible. Alors ... qu'est-ce que je fais de mal parce que la vignette n'a pas montré initialement, elle ne s'est montrée qu'après avoir terminé le survol de la souris. Merci de votre aide. Ce qui suit est ce que je suis (pages aspx ... avec la version gratuite de Visual Web Developer)

<script language="javascript" type="text/javascript"> </script> 

<table style="border:solid black 1px;font-size:12pt; font-family:verdana"> 
<tr> 
<td> 
<img alt="Guiness Advert" id="guiness" name="guiness" src="~/folder1/folder2/folder2//tn_guinness-label.jpg" onmouseover="document.guiness.src ='guinness-label.jpg';" onmouseout="document.red.src ='tn_guinness-label.jpg';" /> 
</td> 
<td> 
<div>Guiness Label</div> 
</td> 
</tr> 
</table> 

Si la solution ne peut être donnée pour ce qui précède, je suis heureux de recevoir toute information que ce soit sur la façon d'atteindre effets de mouseover sur une vignette, dans les pages aspx. Merci beaucoup.

LisaMac

Answer 1

La boîte avec le X rouge est la façon dont IE (en supposant que vous utilisez IE) indique une image manquante.

Vérifiez que le chemin vers votre image miniature dans votre balise img est correct.

La raison pour laquelle il apparaît lorsque vous quittez l'image est que l'événement OnMouseOut a le chemin d'accès correct à l'image.

Je remarque que vous avez un "~" au début. Voulez-vous rechercher à partir de la racine de l'application ou du dossier actuel?

Answer 2

Conservez-vous l'image dans le répertoire ./~/folder1/folder2 etc?

Et n'entendiez-vous pas document.getElementById('guiness').src (ou quoi que ce soit?)?

Answer 3

Il semble y avoir deux problèmes.

a. La cohérence de votre .src

par exemple, il doit être le chemin complet dans tous les cas comme:

document.guiness.src = 'folder1/dossier2/dossier2/guinness-label.jpg »

b. la cohérence de l'utilisation document.guiness.src

par exemple dans le mouseout est:

document.red.src