By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,605 Members | 2,147 Online
Bytes IT Community

Home Questions Articles Browse Topics Latest Top Members FAQ

home > topics > javascript / ajax / dhtml > questions > firefox doesn't process onmousemove
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,605 IT Pros & Developers. It's quick & easy.

Firefox doesn't process onmousemove

P: n/a
Hi.

Please take a look at this page:
http://tinyurl.com/s2l8w

In IE6, putting the mouse on each of the two items highlights the word
in a blue (different image) and shows a tool tip. In Firefox(1.5.0.6),
nothing shows when mouse goes over it. Please view the source of that
simple page (with some JavaScript) to see if you know how I can get
this to look in Firefox like it does in IE?

Thanks.

Sep 5 '06 #1
Share this Question
Share on Google+
7 Replies
P: n/a
Please also let me know if there is another newsgroup that I should
post this sort of question to. Thanks.

80********@videotron.ca wrote:
Hi.

Please take a look at this page:
http://tinyurl.com/s2l8w

In IE6, putting the mouse on each of the two items highlights the word
in a blue (different image) and shows a tool tip. In Firefox(1.5.0.6),
nothing shows when mouse goes over it. Please view the source of that
simple page (with some JavaScript) to see if you know how I can get
this to look in Firefox like it does in IE?

Thanks.
Sep 5 '06 #2
P: n/a
80********@videotron.ca said the following on 9/4/2006 9:33 PM:
Hi.

Please take a look at this page:
http://tinyurl.com/s2l8w

In IE6, putting the mouse on each of the two items highlights the word
in a blue (different image) and shows a tool tip. In Firefox(1.5.0.6),
nothing shows when mouse goes over it. Please view the source of that
simple page (with some JavaScript) to see if you know how I can get
this to look in Firefox like it does in IE?
The problem is that your script is written for IE/NN4 era browsers using
document.layers and document.all. The only reason it even works in IE is
that it still supports document.all and the test for it. Firefox has
limited supported for document.all but it will fail on an
if(document.all) test. Although I personally don't see any reason at all
for using either one.

You use the images collection in the imgoff function but for some reason
you use document.layers/document.all in the imgon function.

I also don't see why you are having so many different function calls for
a simple rollover effect.

function swapImage(imgRef,newSource){
imgRef.src = newSource;
}

And call it as such:

<img src="originalImage.jpg"
onmouseover="swapImage(this,'newImageSrc.jpg')"
onmouseout="swapImage(this,'originalImage.jpg')"
>
The problem with the approach you have now is that when there are many
images on the page, your imgoff function will have to loop through all
the images and set them when it doesn't need to. The only image that
won't be in a default state is the one that has the mouse over it. When
you mouseout, you change it back.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #3
P: n/a
Hi. And thanks for your response.

I just copied that as I was learning many years ago. Time to revise.

So I just have this code now but IE gives script errors when I put my
mouse over the bitmaps. What did I miss:

<HTML>
<HEAD>
<script language="JavaScript" type="text/JavaScript">
<!--
function swapImage(imgRef,newSource){
imgRef.src = newSource;
}
// -->
</script>
<TITLE>Sample</TITLE>
</HEAD>
<BODY bgcolor="Black"><font size="-1"><BR></font>
<table border="0">
<tr>
<td><img src="images/home.jpg" width=80 height=35 alt="Main Page"
border="0"
onmouseover="SwapImage(this,'images/homeon.jpg'),window.status='Main
Page'" onmouseout="SwapImage(this,'images/home.jpg'),
window.status=''"></td>
<td><img src="images/arcade.jpg" width=100 height=35 alt="Classic
Arcade Machines" border="0"
onmouseover="SwapImage(this,'images/arcadeon.jpg'),window.status='Classic
Arcade Machines'"
onmouseout="SwapImage(this,'images/arcade.jpg'),window.status=''"></td>
</tr>
</table>
</BODY>
</HTML>
Thanks.
Randy Webb wrote:
80********@videotron.ca said the following on 9/4/2006 9:33 PM:
Hi.

Please take a look at this page:
http://tinyurl.com/s2l8w

In IE6, putting the mouse on each of the two items highlights the word
in a blue (different image) and shows a tool tip. In Firefox(1.5.0.6),
nothing shows when mouse goes over it. Please view the source of that
simple page (with some JavaScript) to see if you know how I can get
this to look in Firefox like it does in IE?

The problem is that your script is written for IE/NN4 era browsers using
document.layers and document.all. The only reason it even works in IE is
that it still supports document.all and the test for it. Firefox has
limited supported for document.all but it will fail on an
if(document.all) test. Although I personally don't see any reason at all
for using either one.

You use the images collection in the imgoff function but for some reason
you use document.layers/document.all in the imgon function.

I also don't see why you are having so many different function calls for
a simple rollover effect.

function swapImage(imgRef,newSource){
imgRef.src = newSource;
}

And call it as such:

<img src="originalImage.jpg"
onmouseover="swapImage(this,'newImageSrc.jpg')"
onmouseout="swapImage(this,'originalImage.jpg')"
>

The problem with the approach you have now is that when there are many
images on the page, your imgoff function will have to loop through all
the images and set them when it doesn't need to. The only image that
won't be in a default state is the one that has the mouse over it. When
you mouseout, you change it back.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #4
P: n/a
Doh, ok, I capitalized Swap by mistake. Works now.
So now I will work on what do I do to keep the rollover image on when I
click on an item (which eventually takes me to a html page)?
Onclick....

Thanks.

80s.arc...@videotron.ca wrote:
Hi. And thanks for your response.

I just copied that as I was learning many years ago. Time to revise.

So I just have this code now but IE gives script errors when I put my
mouse over the bitmaps. What did I miss:

<HTML>
<HEAD>
<script language="JavaScript" type="text/JavaScript">
<!--
function swapImage(imgRef,newSource){
imgRef.src = newSource;
}
// -->
</script>
<TITLE>Sample</TITLE>
</HEAD>
<BODY bgcolor="Black"><font size="-1"><BR></font>
<table border="0">
<tr>
<td><img src="images/home.jpg" width=80 height=35 alt="Main Page"
border="0"
onmouseover="SwapImage(this,'images/homeon.jpg'),window.status='Main
Page'" onmouseout="SwapImage(this,'images/home.jpg'),
window.status=''"></td>
<td><img src="images/arcade.jpg" width=100 height=35 alt="Classic
Arcade Machines" border="0"
onmouseover="SwapImage(this,'images/arcadeon.jpg'),window.status='Classic
Arcade Machines'"
onmouseout="SwapImage(this,'images/arcade.jpg'),window.status=''"></td>
</tr>
</table>
</BODY>
</HTML>
Thanks.
Randy Webb wrote:
80********@videotron.ca said the following on 9/4/2006 9:33 PM:
Hi.
>
Please take a look at this page:
http://tinyurl.com/s2l8w
>
In IE6, putting the mouse on each of the two items highlights the word
in a blue (different image) and shows a tool tip. In Firefox(1.5.0.6),
nothing shows when mouse goes over it. Please view the source of that
simple page (with some JavaScript) to see if you know how I can get
this to look in Firefox like it does in IE?
The problem is that your script is written for IE/NN4 era browsers using
document.layers and document.all. The only reason it even works in IE is
that it still supports document.all and the test for it. Firefox has
limited supported for document.all but it will fail on an
if(document.all) test. Although I personally don't see any reason at all
for using either one.

You use the images collection in the imgoff function but for some reason
you use document.layers/document.all in the imgon function.

I also don't see why you are having so many different function calls for
a simple rollover effect.

function swapImage(imgRef,newSource){
imgRef.src = newSource;
}

And call it as such:

<img src="originalImage.jpg"
onmouseover="swapImage(this,'newImageSrc.jpg')"
onmouseout="swapImage(this,'originalImage.jpg')"
>
The problem with the approach you have now is that when there are many
images on the page, your imgoff function will have to loop through all
the images and set them when it doesn't need to. The only image that
won't be in a default state is the one that has the mouse over it. When
you mouseout, you change it back.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #5
P: n/a
80********@videotron.ca said the following on 9/4/2006 11:34 PM:
Doh, ok, I capitalized Swap by mistake. Works now.
So now I will work on what do I do to keep the rollover image on when I
click on an item (which eventually takes me to a html page)?
Onclick....
If you are navigating away from the page, then it won't matter will it?

onclick="thisClicked(this,'clickedImage.jpg')"

function thisClicked(elemClicked,newSrc){
elemClicked.onmouseover=null;
elemClicked.onmouseout=null;
elemClicked.src = newSrc;
}

That will remove the onmouseover and onmouseout event handlers from the
image so that mousing over them won't change them anymore.

Still not sure what the point of making an image change when navigating
away though.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #6
P: n/a
Oh, let me explain more. This is the top page of a simple frame based
page. So click on those items will change the bottom frame. Hence,
when click on the Arcade item, I would put a new frame at the bottom
and I wanted the Arcade item image to remain to the 'on' one. At this
point, moving my mouse over the Home would make it highlight but moving
the mouse over the Arcade would do nothing as it is on that frame
already. Clicking on Home would then highlight Home permanently with
the 'on' image and undo the Arcade 'on' image. Thanks.

Randy Webb wrote:
80********@videotron.ca said the following on 9/4/2006 11:34 PM:
Doh, ok, I capitalized Swap by mistake. Works now.
So now I will work on what do I do to keep the rollover image on when I
click on an item (which eventually takes me to a html page)?
Onclick....

If you are navigating away from the page, then it won't matter will it?

onclick="thisClicked(this,'clickedImage.jpg')"

function thisClicked(elemClicked,newSrc){
elemClicked.onmouseover=null;
elemClicked.onmouseout=null;
elemClicked.src = newSrc;
}

That will remove the onmouseover and onmouseout event handlers from the
image so that mousing over them won't change them anymore.

Still not sure what the point of making an image change when navigating
away though.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #7
P: n/a
80********@videotron.ca said the following on 9/4/2006 11:57 PM:
Oh, let me explain more. This is the top page of a simple frame based
page. So click on those items will change the bottom frame. Hence,
when click on the Arcade item, I would put a new frame at the bottom
and I wanted the Arcade item image to remain to the 'on' one. At this
point, moving my mouse over the Home would make it highlight but moving
the mouse over the Arcade would do nothing as it is on that frame
already. Clicking on Home would then highlight Home permanently with
the 'on' image and undo the Arcade 'on' image. Thanks.
The best that you could do would be to try to set a flag when navigation
happens and then check that flag onmouse* to see whether to trigger the
rollover effect.

onclick - change the image, reset all others, set a flag variable.
onmouseover - check the variable and act.

The flag variable could be set to the ID/NAME of the image that got
clicked. If the current mouseover is that image, then do nothing.
--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 7 '06 #8

This discussion thread is closed

Replies have been disabled for this discussion.

Question stats

  • viewed: 6116
  • replies: 7
  • date asked: Sep 5 '06
BYTES.COM © 2019 About Bytes | Advertise on Bytes | Privacy Policy | Manage Cookies
Sitemap | JavaScript / Ajax / DHTML Answers Sitemap | JavaScript / Ajax / DHTML Insights Sitemap

Follow us to get the Latest Bytes Updates