Question

我正在使用以下内容，以便网站访问者可以点击缩略图（在本例中称为tn_guinness-label.jpg），当他们点击时，会出现一个更大的图像（在这种情况下称为guinness-label.jpg ）。所以......我试过了，所有我能看到的都是一个内部带有红色X的小盒子，当我将鼠标悬停在红色X上时，它按原样工作并向我展示了更大的图像。

为什么我在鼠标悬停之前没有显示缩略图？此外，在我完成鼠标悬停然后将鼠标移开后，我可以实际看到缩略图图像，然后保留在视图上。所以....我做错了什么因为缩略图最初没有显示，它只显示在我完成鼠标悬停之后。谢谢您的帮助。以下是我正在使用的内容（aspx页面...使用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>

如果无法解决上述问题，我很高兴收到有关如何在缩略图上实现鼠标悬停效果的任何信息，在aspx页面中。非常感谢。

LisaMac

Answer 1

带有红色X的方框是IE（假设您使用的是IE）表示缺少图像的方式。

检查img标记中缩略图图像的路径是否正确。

离开图片时出现的原因是OnMouseOut事件具有正确的图像路径。

我注意到你开始时有一个“〜”。您的意思是从应用程序的根目录或当前文件夹中搜索吗？

Answer 2

您是否将图片保存在./~/folder1/folder2等目录中？

你不是指document.getElementById('guiness').src（或者它是什么？）？

Answer 3

似乎有两个问题。

一个。 .src的一致性

例如，它应该是所有情况下的完整路径，如：

document.guiness.src ='folder1 / folder2 / folder2 / guinness-label.jpg“

湾使用document.guiness.src

的一致性

例如在mouseout中它是：

document.red.src

OnMouseOver有效，但小缩略图仅保留为红色X - 如何显示拇指？

3 个答案: