Forum Moderators: open
In the head I have
</style>
<script language='javascript'>
var beach = new Image();
var vista = new Image();
beach.src = "images/abc.jpg";
vista.src = "images/123.jpg";
function doButtons(picimage) {
eval("document['picture'].src = " + picimage + ".src");
}// End -->
</script>
I want to somehow do the same thing with a file instead of an image.
Any ideas?
In the body I have
<ul><li><a class="links" href="page.htm" onMouseOver= "doButtons('vista');return true">Vista Point</a></li>
<li><a class="links" href="page2.htm" onMouseOver= "doButtons('beach');return true">Beach</a></li>
and for the target I have
<img name=picture src="images/abc.jpg" width=288 border=0 align="right" height="216">
The usual suspects are:
- Loading content into hidden iframe, then putting it where you want. The main issue here is knowing when the iframe has loaded.
- Using an XMLHTTPRequest object. Reaonably well supported these days, but not just a couple of lines of code.
IE has an inbuilt (default) 'Download Behavior. This is fairly easy, but IE-only.
The most popular link on the whole subject is a Netscape DevEdge article. It seems to be unavailable at present, but I'll post the link, just in case the situation is temporary.
PS. eval has been banned (by me)
//
function doButtons(picimage) {
document.images['picture'].src = picimage.src;
}
with:
doButtons(vista); // no quotes