Member Avatar for vikaspa

Need your help in javascript

I am using following script for image over (to display another image)
<html>
<img src="mobilesmallimage.jpg" name="ShowRoom" width="129" height="96" onMouseOver=" ShowPic(name,'mobilebigimage.jpg') " onmouseout="ShowPic(name,'mobilesmallimage.jpg')" border="0"> </a>

I am sending 2 parameters
1. Name of image - variable name
2. Name of image to be displayed

Using following javascript
<javascript>
<script language="javascript"> function ShowPic(imgname, sImage) {
var Imgname=imgname;
var sImage = sImage ; j='document.' +Imgname+'.src = '+sImage; alert(j); eval('document.' +Imgname+'.src = '+sImage);
; } </script>

alert shows me correct value i.e. the image to be dispayed however the image is not displayed here

However following set of code works fine

<img src="mobilesmallimage.jpg" name="ShowRoom" width="129" height="96" onMouseOver="ShowPic('mobilebigimage.jpg')" onmouseout="ShowPic('mobilesmallimage.jpg')" border="0"> </a>

and javascript
<script language="javascript"> function ShowPic(sImage) {
sImage = sImage ; document.ShowRoom.src = sImage; } </script>


Please help

Thanks in advance

  • 2 Contributors
  • 3 Replies
  • 128 Views
  • 15 Hours Discussion Span
  • Latest Post Latest Post by chaosprime
Member Avatar for chaosprime

Try this: eval('document.' +Imgname+'.src = \''+sImage+'\''); You are probably in dire need of debugging feedback; lots of people seem to think they have to write JavaScript using solely their imagination. I recommend loading up your page in Firefox and looking at Tools > Error Console.

Member Avatar for vikaspa

Dear Sir

I appreciate your valued feed back

I traied eval (in javascript function)
May try in html part ?

Let me elaborate you why am asking this :

I am writing code for cms (Content Management software)
In this we could different image on the mouse over

However if data is read from database then I need to dynamically give values for name and images to be displayed on mouse over and on mouse out

to simulate this I had changed the javascript given to you

Hope this clarifies

Member Avatar for chaosprime

No, that doesn't really tell me anything useful.

What I'm saying in my post is that you need to wrap the target URL you're changing the image's source to in single quotes. You're constructing an eval that looks like this:

document.someName.src = mobilebigimage.jpg

This should be what you're seeing in your alerts. This will not work. You need to be doing this:

document.someName.src = 'mobilebigimage.jpg'

The replacement eval-construction code I posted before is a way to do this.

The reason that nothing like this had to be done before, but has to be done now, is that you're changing methodologies to using an eval, which means that you have to make a string that interprets as valid JavaScript.

But then, the whole methodology you're using isn't really such a good idea. So here's another suggestion for what to do instead of any of this:

<javascript>
<script language="javascript">
function ShowPic(imgname, sImage) {
    document[imgname].src = sImage;
}
</script>

If I'm not horribly mistaken, that will work far better and with much less fuss.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.