By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,180 Members | 1,065 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,180 IT Pros & Developers. It's quick & easy.

Help: swap Image Link works in IE but Not FF

P: n/a
I'm not much of a JS programmer so I used the the standard Macromedia swap
image function for a disjointed rollover..which works
fine.. no problem swapping the image with that code....

but when I add the following to the onMouseOver to the thumbnail:
onMouseOver="Product_Link.href='http://glasstoilets.com/catalog/tank1-p-28.html';

and

this to the full size...

<a href="" name="Product_Link"><img src="Files/images/300x216/PICT0876.jpg"
name="Main_Image" width="300" height="216" id="PICT1204_l"</a>

It works fine in IE but not firefox... Meaning the images swap no problem in
both but the link only works in IE. My searching tells me that I may have
to use getElementById() but I'm not sure how to implement it in this
scenario.

Any help is greatly appreciated.
pejo
------------------------------------------------------
"Before you criticize someone
Walk a mile in their shoes
Then when you do criticize them
you'll be a mile away and
Wearing their shoes"
---seen on a wall somewhere in London
May 25 '07 #1
Share this Question
Share on Google+
3 Replies


P: n/a
PEJO wrote on 25 mei 2007 in comp.lang.javascript:
I'm not much of a JS programmer so I used the the standard Macromedia
swap image function for a disjointed rollover..which works
fine.. no problem swapping the image with that code....

but when I add the following to the onMouseOver to the thumbnail:
onMouseOver="Product_Link.href='http://glasstoilets.com/catalog/tank1-p
-28.html';

and

this to the full size...

<a href="" name="Product_Link"><img
src="Files/images/300x216/PICT0876.jpg" name="Main_Image" width="300"
height="216" id="PICT1204_l"</a>

It works fine in IE but not firefox... Meaning the images swap no
problem in both but the link only works in IE. My searching tells me
that I may have to use getElementById() but I'm not sure how to
implement it in this scenario.

Any help is greatly appreciated.
Try this first:

<img src="Files/images/300x216/PICT0876.jpg"
onMouseOver="this.href='http://glasstoilets.com/catalog/tank1-p-28.html'"
onmouseout="this.href='Files/images/300x216/PICT0876.jpg'"
>
======================

FF correctly does not use a element name as an object.

Try:

<img src='' id="Plnk">

<img src="Files/images/300x216/PICT0876.jpg"
onMouseOver=
"document.getElementById('Plnk').href =
'http://glasstoilets.com/catalog/tank1-p-28.html'"
>


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 25 '07 #2

P: n/a
OK I've tried this.. I'm getting a JS error when I rollover the small image.
It swaps the image but not the links.

here is the code I implemented as per your explanation.

for the thumbnail:

<a href="http://glasstoilets.com/catalog/tank1-p-28.html"
onMouseOver="MM_swapImage('Bass_model_s','','Files/images/70x50/Bass_model.jpg',1);MM_swapImage('Main_Image','','F iles/images/300x216/Bass_model.jpg',1)"><img
src="Files/images/70x50/Bass_model.jpg"
onMouseOver="document.getElementById('Plnk').href= 'http://glasstoilets.com/catalog/tank1-p-28.html';"
name="Bass_model_s" border="0" id="Bass_model_s"></a>

(The Debug popup points to an error in the above code.)
here is what I have for the main image as well

<img src="Files/images/300x216/PICT0876.jpg" name="Main_Image" width="300"
height="216" id="Plnk">

pete.


"Evertjan." <ex**************@interxnl.netwrote in message
news:Xn********************@194.109.133.242...
PEJO wrote on 25 mei 2007 in comp.lang.javascript:
>I'm not much of a JS programmer so I used the the standard Macromedia
swap image function for a disjointed rollover..which works
fine.. no problem swapping the image with that code....

but when I add the following to the onMouseOver to the thumbnail:
onMouseOver="Product_Link.href='http://glasstoilets.com/catalog/tank1-p
-28.html';

and

this to the full size...

<a href="" name="Product_Link"><img
src="Files/images/300x216/PICT0876.jpg" name="Main_Image" width="300"
height="216" id="PICT1204_l"</a>

It works fine in IE but not firefox... Meaning the images swap no
problem in both but the link only works in IE. My searching tells me
that I may have to use getElementById() but I'm not sure how to
implement it in this scenario.

Any help is greatly appreciated.

Try this first:

<img src="Files/images/300x216/PICT0876.jpg"
onMouseOver="this.href='http://glasstoilets.com/catalog/tank1-p-28.html'"
onmouseout="this.href='Files/images/300x216/PICT0876.jpg'"
>>

======================

FF correctly does not use a element name as an object.

Try:

<img src='' id="Plnk">

<img src="Files/images/300x216/PICT0876.jpg"
onMouseOver=
"document.getElementById('Plnk').href =
'http://glasstoilets.com/catalog/tank1-p-28.html'"
>>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

May 28 '07 #3

P: n/a
PEJO wrote on 28 mei 2007 in comp.lang.javascript:
OK I've tried this.. I'm getting a JS error when I rollover the small
image. It swaps the image but not the links.
PLEASE do not toppost, but post under each part of the text you aree
reacting on.

here is the code I implemented as per your explanation.

for the thumbnail:

<a href="http://glasstoilets.com/catalog/tank1-p-28.html"
onMouseOver="MM_swapImage('Bass_model_s','','Files/images/70x50/Bass_mo
MM_swapImage() what function is that?
del.jpg',1);MM_swapImage('Main_Image','','Files/images/300x216/Bass_mod
el.jpg',1)"><img src="Files/images/70x50/Bass_model.jpg"
onMouseOver="document.getElementById('Plnk').href= 'http://glasstoilets.
com/catalog/tank1-p-28.html';" name="Bass_model_s" border="0"
id="Bass_model_s"></a>
So you have TWO onmouseovers over each other,
each changing some attribute of the other?

Why?

I do not even know what you want to accomplish.

Do you?

Why would you want to change an <ahref on mouseover, since you cannt
click it without first hoovering?
(The Debug popup points to an error in the above code.)
What is a "Debug popup"?
What error?
What line of code?

btw, why do you name an img that has a id?
here is what I have for the main image as well

<img src="Files/images/300x216/PICT0876.jpg" name="Main_Image"
width="300" height="216" id="Plnk">
==============================

The best I can do for you is deleting all the code junk that is not
part of the probem and show you this:

<img
src='PICT0876.jpg'
id='Plnk'
>
<br><br>
<img
src='img1.jpg'
onMouseOver='doit(this);'
onClick= 'goThere();'
alt = 'Hover me or click me!'
>
<script type='text/javascript'>

function doit(x) {
x.src = 'img2.jpg';
x.style.cursor = 'pointer';
document.getElementById('Plnk').src =
'PICT0999999.jpg';
};

function goThere() {
location.href = 'http://cnn.com/';
};

</script>
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 28 '07 #4

This discussion thread is closed

Replies have been disabled for this discussion.