Don't know how to make script with preloaded images
Can someone look over this and tell me what I have to do to get the images to show up?
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- //Begin
function changeImage(filename)
{
mainimage.src = filename;
}
// End -->
</script>
</head>
<body>
<p>
<a href="javascript:changeImage('image-viewer/image1.jpg')">Image 1</a>
<a href="javascript:changeImage('image-viewer/image2.jpg')">Image 2</a>
<a href="javascript:changeImage('image-viewer/image3.jpg')">Image 3</a>
<a href="javascript:changeImage('image-viewer/image4.jpg')">Image 4</a>
</p>
<p>
<img name="mainimage" src="image-vi开发者_JS百科ewer/blank.jpg"></p>
<p><center>
<font face="arial, helvetica" size"-2">
</center><p>
</script>
</font></body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Sample page</title>
<script type="text/javascript">
function changeImage(replacement)
{
document.getElementById("main_image").src = replacement;
return false;
}
</script>
</head>
<body>
<ul>
<li><a href="javascript:changeImage('image1.jpg')">Image 1</a></li>
<li><a href="javascript:changeImage('image2.jpg')">Image 2</a></li>
<li><a href="javascript:changeImage('image3.jpg')">Image 3</a></li>
<li><a href="javascript:changeImage('image4.jpg')">Image 4</a></li>
</ul>
<p>
<img id="main_image" src="image-viewer/blank.jpg" alt="" />
</p>
</body>
</html>
Change your function to:
function changeImage(filename) {
document.main_image.src=filename;
void(0);
}
A good friend helped me look this up
mainimage.src = filename; is wrong, and should instead be
<img name="mainimage" src="image-viewer/blank.jpg">
should be
<img id ="mainimage" src="image-viewer/blank.jpg">
And then this:
mainimage.src = filename;
should be
document.getElementById("mainimage").setAttribute("src", filename);
there's an extra tag in the end.
I think she's having more of a problem with her image locations, though. He needs more info about project
Edit : What might be happening
is she has the html file
in the same folder
as the images
which really won't work.
because if all her files are in
c:/image-viewer/
with no subdirectories
and the html file is c:/image-viewer/index.html. Therefore she needs a new folder for the images
Because the script is asking for c:/image-viewer/image-viewer/image1.jpg as opposed to c:/image-viewer/image1.jpg
If this isn't for a class, she needs to learn to write standards compliant code. Look up DOM
if all the files are in one folder, then she has to do away with image-viewer/ in front of the file names.
加载中,请稍侯......
精彩评论