469,270 Members | 1,055 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,270 developers. It's quick & easy.

Advice on Preloading Images.

Hi folks,

I am using the following code for mouse over (roll-overs) in my XHTML code.

<a onmouseover="document.getElementById('sitemap').sr c =
'../images/buttons/sitemap_mo.jpg';"
onmouseout="document.getElementById('sitemap').src =
'../images/buttons/sitemap.jpg';"
href="../sitemap.htm" border="0">
<img id='sitemap' src="../images/buttons/sitemap.jpg" border="0" alt="Site
Map"/></a>

However, I have not preloaded the images, and wonder if someone could help
by suggesting suitable code to preload the images.

Regards,
C.B.
Sep 26 '06 #1
1 1237

"Cerebral Believer" <no**********@hadenoughalready.comwrote in message
news:lk*******************@newsfe2-gui.ntli.net...
Hi folks,

I am using the following code for mouse over (roll-overs) in my XHTML
code.

<a onmouseover="document.getElementById('sitemap').sr c =
'../images/buttons/sitemap_mo.jpg';"
onmouseout="document.getElementById('sitemap').src =
'../images/buttons/sitemap.jpg';"
href="../sitemap.htm" border="0">
<img id='sitemap' src="../images/buttons/sitemap.jpg" border="0" alt="Site
Map"/></a>

However, I have not preloaded the images, and wonder if someone could help
by suggesting suitable code to preload the images.

Regards,
C.B.
I was thinking of using this code in the head section

<script Language="JavaScript" typr="text/javascript">

image1 = new Image();
image1.src = "images/buttons/home.jpg";
image2 = new Image();
image2.src = "images/buttons/home_mo.jpg";
image3 = new Image();
image3.src = "images/buttons/blog.jpg";
image4 = new Image();
image4.src = "images/buttons/blog_mo.jpg";
image5 = new Image();
image5.src = "images/buttons/reviews.jpg";
image6 = new Image();
image6.src = "images/buttons/reviews_mo.jpg";

image7 = new Image(); image7.src = "images/buttons/music.jpg"; image8 = new
Image(); image8.src = "images/buttons/nusic_mo.jpg"; image9 = new Image();
image9.src = "images/buttons/links.jpg"; image10 = new Image(); image10.src
= "images/buttons/links_mo.jpg"; image11 = new Image(); image11.src =
"images/buttons/contact.jpg"; image12 = new Image(); image12.src =
"images/buttons/contact_mo.jpg"; image13 = new Image(); image13.src =
"images/buttons/sitemap.jpg"; image14 = new Image(); image14.src =
"images/buttons/sitemap_mo.jpg";

</script>

Would this be suitable code to preload the images for more efficient loading
for my HTML code originally posted?

I wonder if the JavaScript preload statements must all be on a new line, or
if they can just be one one line separated by ";".

Regards,
C.B.
Sep 26 '06 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

22 posts views Thread by Fabian | last post: by
6 posts views Thread by michaaal | last post: by
2 posts views Thread by windandwaves | last post: by
40 posts views Thread by Geoff Cox | last post: by
2 posts views Thread by sachaburnett | last post: by
7 posts views Thread by Keith Hughitt | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.