Image can't hyperlink

First Post here.

I have this script that I found online. It works great.
The Problem I am having is I am now trying to hyperlink the image and it's not working.

what the script does is onmouseover it enlarges the image.
I would like when it does this to be able to click on the enlarged image as a link to another page.

<style>
#img_container
{
position:absolute;
display:none;
border:1px solid #f00;
background:#fff;
}
#large_img
{
width:200px;
height:290px;
}
</style>

<script>
function show(obj,obj1,obj2)
{
document.getElementById(obj).style.display="block";
document.getElementById(obj2).src=obj1.src;
var x_coords=findPosX(obj1);
var y_coords=findPosY(obj1);
document.getElementById(obj).style.left=x_coords;
document.getElementById(obj).style.top=y_coords;
}
function hide(id)
{
document.getElementById(id).style.display="none";
}
function findPosX(obj)
{
var curleft = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (document.layers)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (document.layers)
curtop += obj.y;
return curtop;
}
</script>

Here is what the image code is
<img id="img1" width="117" height="180" src="../Images /David.jpg" border="2" onmouseover="show('img_container',this,'large_img');" alt="David">

Hope someone can help.
Thanks

Welcome Eric, thanks for stealing my name LOL.

Found your problem bud something small but easy to fix, You have a space in between Images and /David.jpg just remove that space so it looks like this


<img id="img1" width="117" height="180" src="../Images/David.jpg" border="2" onmouseover="show('img_container',this,'large_img');" alt="David">

instead of

<img id="img1" width="117" height="180" src="../Images /David.jpg" border="2" onmouseover="show('img_container',this,'large_img');" alt="David">

or try

<img id="img1" width="117" height="180" src="Images/David.jpg" border="2" onmouseover="show('img_container',this,'large_img');" alt="David">

Thanks for the typo error but it still doesn't work. I am trying to do something like this.

It seems not to work because of the script effect it does.
It works without the effect but I would like to hyperlink the 'large_img'. With the Effect

<a href="David.html" target="right"><img id="img1" width="117" height="180" src="../Images /David.jpg" border="2" onmouseover="show('img_container',this,'large_img');" alt="David">

I think why its not working is cause you need to specify the large image in your CSS coding not just the size

or look at your javascript it says function show(obj,obj1,obj2)
try replaceing that with img1 seeing as i dont see any obj in ur code.

<style>
#img_container
{
position:absolute;
display:none;
border:1px solid #f00;
background:#fff;
}
#large_img
{
width:200px;
height:290px;
}
</style>

<script>
function show(obj,obj1,obj2)
{
document.getElementById(obj).style.display="block";
document.getElementById(obj2).src=obj1.src;
var x_coords=findPosX(obj1);
var y_coords=findPosY(obj1);
document.getElementById(obj).style.left=x_coords;
document.getElementById(obj).style.top=y_coords;
}
function hide(id)
{
document.getElementById(id).style.display="none";
}
function findPosX(obj)
{
var curleft = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (document.layers)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (document.layers)
curtop += obj.y;
return curtop;
}
</script>

This is the script obj,obj1,obj2 are used in this script.

yes but ur target id is img one so try using obj instead of img in the target

img id="img1" to img id="obj"

I have about 10 img id's on this page
img1 - img10. I don't know how changing "img" to "obj" will help.

cause your javascript isnt calling for img id's they are looking for obj just try i9t and see if that helps

I tried the obj and still didn't work.
Is there another way I can make this work?