我要做的是将鼠标悬停在单独的图像上时将图像（信息框）更改为不同的图像（信息框A）（图像A）。我还应该注意，解决方案需要足够灵活，以便当将鼠标悬停在单独但相应的图像上时，信息框可以转换为各种不同的图像（信息框A，B，C，...）（图像A，B，C，......）。还将有多组信息框和图像。如果它有助于可视化或概念化我想要完成的内容，那么我正在处理的是这个页面：http://www.cupofcomics.com/library/
目前我正在使用的一般代码是：
Java脚本
window.onload = function(){
var pic = document.getElementById("pic");
var HlPica = document.getElementById("otherPic");
oPic.onmouseover = function(){
pic.src = "http://cupofcomics.com/images/library/info/headliners/HlPicaInfo.png";
}
oPic.onmouseout = function(){
pic.src = "http://cupofcomics.com/images/library/info/infonull.png";
}
}
HTML
<img id="otherPic" src="http://cupofcomics.com/images/library/bindings/headliners/HlPica.png">
<img id="pic" src="http://cupofcomics.com/images/library/info/infonull.png">
我对javascript之外的解决方案持开放态度，但我做的研究使我相信javascript是最简单的解决方案。当涉及到所有意义上的编码时，我是非常业余的但是据我所知，javascript，我不确定我缺少什么。感谢。