1

我在尝试将图像描述放在我的主图像下方时遇到了很多麻烦，但在 Dreamweaver 中创建的图像库中的缩略图上方，单击时图像交换。我遇到问题的页面在这里：

http://marychatham.com/work.html

“瓷器。14.5 英寸高 x 8 英寸宽。” 是发生图像交换时我想更改的描述。

这是我的代码：

<div id="MainImage"><img src="images/MaryChatham_01.png" name="main" id="main"></div>
<div id="Description">
<h4>Porcelain. 14.5" H x 8" W.</h4>
</div>
<div id="Thumbs">
    <div id="Thumb1"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_01.png',1)"><img src="images/MaryChatham_Thumbnail_01.png" alt="Por" name="t1" id="t1" border="0"></a></div>
    <div id="Thumb2"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_02.png',1)"><img src="images/MaryChatham_Thumbnail_02.png" alt="Ce" name="t2" id="t2" border="0"></a></div>
<div id="Thumb3"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_03.png',1)"><img src="images/MaryChatham_Thumbnail_03.png" name="t3" id="t3" border="0"></a></div>
    <div id="Thumb4"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_04.png',1)"><img src="images/MaryChatham_Thumbnail_04.png" name="t4" id="t4" border="0"></a></div>
    <div id="Thumb5"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_05.png',1)"><img src="images/MaryChatham_Thumbnail_05.png" name="t5" id="t5" border="0"></a></div>
    <div id="Thumb6"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_06.png',1)"><img src="images/MaryChatham_Thumbnail_06.png" name="t6" id="t6" border="0"></a></div>
    <div id="Thumb7"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_07.png',1)"><img src="images/MaryChatham_Thumbnail_07.png" name="t7" id="t7" border="0"></a></div>
    <div id="Thumb8"><a href="javascript:;" onClick="MM_swapImage('main','','images/MaryChatham_08.png',1)"><img src="images/MaryChatham_Thumbnail_08.png" name="t8" id="t8" border="0"></a></div>
</div>
</div>
</div>
</body>
</html>

感谢您的帮助。我已经被困了好几天了。

4

1 回答 1

1

给h4“描述” div 中的标签一个id; 就像是：

<div id="Description">
<h4 id="caption">Porcelain. 14.5" H x 8" W.</h4>
</div>

然后给每个aatitle加上你想要的图像标题。例如：

<div id="Thumb1">
<a href="javascript:;" title="This is my sweet caption." onClick="MM_swapImage('main','','images/MaryChatham_01.png',1)">
<img src="images/MaryChatham_Thumbnail_01.png" alt="Por" name="t1" id="t1" border="0">
</a>
</div>

然后，而不是使用MM_swapImage你正在使用的东西，使用这个：

onClick = "document.getElementById('main').src = 'images/MaryChatham_01.png'; document.getElementById('caption').innerHTML = this.title;"

你也不需要那个href="javascript:;"东西；只是href=""更可取。所以每个拇指看起来像这样：

<div id="Thumb1">
<a href="" title="This is my sweet caption." onClick="document.getElementById('main').src = 'images/MaryChatham_01.png'; document.getElementById('caption').innerHTML = this.title;">
<img src="images/MaryChatham_Thumbnail_01.png" alt="Por" name="t1" id="t1" border="0">
</a>
</div>

如果您了解一些超基本的 Javascript，这实际上是一件非常简单的事情。我真的建议花时间学习一些基础知识；你会惊讶于你能完成什么。

于 2013-09-14T15:02:53.110 回答