Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Preloading Images

Status
Not open for further replies.
andycruce

andycruce

Programmer
Jun 25, 2002
11
0
0
US
I am trying to preload images for a page and then use mouseover, etc. events to switch between the images. Everything seems to work as expected except my browser still goes out to the web to get what I had hoped were preloaded images. I have checked several posting areas and references and believe that I am doing this correctly. Also the code is similar to what I have used in the past. I don't know whether the problem is in the code, the browser setup or what. A simplified sample of what I am trying to do is presented below. The code exhibits the same problems I discribed above when loaded on my site.

<!doctype html PUBLIC &quot;-//W3C//DTD html 4.01 transitional//EN&quot;>
<html>
<head>
<title>Image Save Test</title>

<SCRIPT LANGUAGE=&quot;javascript&quot;>
var testimage1=new Image(180,17);
testimage1.src = &quot;PollingAreaYellow.gif&quot;;
var testimage2=new Image(180,17);
testimage2.src = &quot;PollingAreaBlue.gif&quot;;

function LoadImage1()
{
document.images[&quot;AddressBook&quot;].src=testimage1.src;

}
function LoadImage2()

{
document.images[&quot;AddressBook&quot;].src=testimage2.src;
}

</SCRIPT>
</head>
<body>

<A HREF=&quot;AddressBook/AddressBook.cgi&quot; TARGET=&quot;_top&quot;
onClick=&quot;&quot;
onMouseOver=&quot;LoadImage1()&quot;
onMouseOut=&quot;LoadImage2()&quot;>
<IMG SRC=&quot;BaseDirImages/AddressBookBlue.gif&quot; WIDTH=&quot;180&quot; HEIGHT=&quot;17&quot; BORDER=&quot;0&quot; ALT=&quot;&quot; NAME=&quot;AddressBook&quot;></A>

</body>
</html>

Any suggestions?

Thanks

Andy Cruce
 
Sort by date Sort by votes
may be your internet cache is full or not being used. May be the image files are very big. There doesnt seem to be anything wrong with the code.

make sure you have the full relative path to the image, not just the iamge name. Ie if your images are in the images directory and this htm file is not you should reference the image in your script by saying

var im1 = new Image(18,17);
im1.src = &quot;images/PollingAreaYellow.gif&quot;;
 
Upvote 0 Downvote
this happened to me in IE when I had my &quot;Temporary Internet Files&quot; setting set to &quot;Always&quot; - change it to &quot;Automatically&quot; and you should be OK.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lupidol
  • Locked
  • Question
Alternate images not working
Replies
2
Views
39
lupidol
lupidol
c0deM0nK424
  • Locked
  • Question
auto detect viewport or screen size and load different images for flexslider carosel ?
Replies
0
Views
42
c0deM0nK424
c0deM0nK424
BrotherArnold
  • Locked
  • Question
Mouseover div problem with swapping images
Replies
2
Views
33
BrotherArnold
BrotherArnold
emozley
  • Locked
  • Question
Inserting images with jQuery
Replies
0
Views
15
emozley
emozley
mwebbo1
  • Locked
  • Question
Multiple backround images
Replies
2
Views
14
darryncooke
darryncooke

Part and Inventory Search

Sponsor

Back
Top