Question

我有一段时间以前有人帮我设计我的网站，需要修复一些看起来不完整的东西。我有一个图像，在鼠标悬停的某些文本上被替换。我需要的是替换的图像可以点击文本所指向的同一链接。例如，鼠标移动文本＆＃34; Portfolio＆＃34;将图像更改为我已预加载的图像。点击文字＆＃34; Portfolio＆＃34;将用户带到图库。我希望能够点击图像转到与单击文本相同的位置。这是为我实现的代码。

HTML

<div class="cmDirectory"><a onMouseover="changeimage(myimages[1],this.href)" href="http://www.example.com">Portfolio</a></div>

html用于鼠标悬停时更改的初始照片

<a href="javascript:warp()"><img class="loader" src="/path/to/initialimage.jpg" name="targetimage" border="0"></a>

的javascript

var myimages=new Array()
var gotolink="#"

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}

preloadimages("/path/to/image1.jpg",
"/path/to/image2")

function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}

我是一名编码新手，请具体说明您的答案。看起来我需要在javascript中添加一些内容来定义每张照片的链接。

Answer 1

只需改变一下：

<a href="javascript:warp()"><img class="loader" src="/path/to/initialimage.jpg" name="targetimage" border="0"></a>

到此：

<a name="img_link" href="javascript:warp()"><img class="loader" src="/path/to/initialimage.jpg" name="targetimage" border="0"></a>

并在JavaScript中替换它：

function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}

使用：

function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
document.img_link.href=url;
}

在鼠标悬停时链接图像

1 个答案: