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 wOOdy-Soft on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

OnMouseOver, exchange images... 2

Status
Not open for further replies.
Isadore

Isadore

Technical User
Feb 3, 2002
2,167
US
Been looking throught the FAQs and String Search but can't nail this one down. Could someone take a brief look and see if you can tell where the problem lies:

<HTML>
<HEAD>
<title>Main Data Menu</title>
<Script Language=&quot;JavaScript&quot;>
<!-- Hide Script from non-Javascript browsers
function displayMsg(message) {
window.status=message
}
function preloadImages() {
if (document.images) {
var imgFiles = preloadImages.arguments;
var preloadArray = new Array();
for (var i=0; 1 < imgFiles.length; i++) {
preloadArray=new image;
preloadArray.src=imgFiles;
}
}
}
function swap(id, newSrc) {
var theImage=locateImage(id);
if (theImage) {
theImage.src=newSrc;
}
}
function locateImage(name) {
var theImage=false;
if (document.images) {
theImage=document.images[name];
}
if (theImage) {
return theImage;
}
return(false);
}
<//-->
</Script>
</HEAD>
<body bgProperties=&quot;fixed&quot; background=&quot;images/marble.jpg&quot;>
<Script Language = &quot;JavaScript&quot;>
<!--
preloadImages('frogdotb.gif', 'frogdance.gif');
//-->
</script>
<form id=&quot;Form1&quot; method=&quot;post&quot; runat=&quot;server&quot;>
<TABLE....

NOTE: this is the image object:

<img name=&quot;frog&quot; src=&quot;images/frogdotb.gif&quot; border=&quot;0&quot; onMouseOut=&quot;swap('frogdotb.gif','frogdance.gif')&quot; onMouseOver=&quot;swap('frogbotd.gif','frogdance.gif')&quot;>
</Body>
</Html>
 
Sort by date Sort by votes
You have such a function:
function swap(id, newSrc)

So you need to pass 2 parameters, and the first one is image name, instead of image src:
onMouseOut=&quot;swap('frog','frogdance.gif')
 
Upvote 0 Downvote
oh dear. Simplify things by all means.

<script>
var images = new Array();
function preload(src)
{
var image = new Image()
image.src = src;
images[images.length] = image;
}
preload(&quot;frogdance.gif&quot;);
</script>

<img name=&quot;frog&quot; src=&quot;frogdotb.gif&quot; border=&quot;0&quot; onMouseOut=&quot;this.src = 'frogdotb.gif')&quot; onMouseOver=&quot;this.src = 'frogdance.gif')&quot;>
Gary Haran
 
Upvote 0 Downvote
Isadore,

Listen to Xutopia. &quot;did you just say Minkey?, yes that's what I said.&quot;

MrGreed
 
Upvote 0 Downvote
Xutopia: Thanks, I found an additional format but love yours. In my case I had this small frog, blinking his eyes, and on MouseOver it turns into a dancing frog. Sound like fun?

Anyway, great technique, love it. Thanks for your help --

A star for you Xutopica!

To see the result of this thread go to:


Thanks guys and gals!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lupidol
  • Locked
  • Question
Alternate images not working
Replies
2
Views
160
lupidol
lupidol
c0deM0nK424
  • Locked
  • Question
auto detect viewport or screen size and load different images for flexslider carosel ?
Replies
0
Views
168
c0deM0nK424
c0deM0nK424
wbodger
  • Locked
  • Question
weird link behavior in IE9 related to onmouseover?
Replies
0
Views
116
wbodger
wbodger
BrotherArnold
  • Locked
  • Question
Mouseover div problem with swapping images
Replies
2
Views
136
BrotherArnold
BrotherArnold
emozley
  • Locked
  • Question
Inserting images with jQuery
Replies
0
Views
119
emozley
emozley

Part and Inventory Search

Sponsor

Back
Top