Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Firefox doesn't process onmousemove

Reply
Thread Tools

Firefox doesn't process onmousemove

 
 
80s.arcade@videotron.ca
Guest
Posts: n/a
 
      09-05-2006
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.

 
Reply With Quote
 
 
 
 
80s.arcade@videotron.ca
Guest
Posts: n/a
 
      09-05-2006
Please also let me know if there is another newsgroup that I should
post this sort of question to. Thanks.

http://www.velocityreviews.com/forums/(E-Mail Removed) 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.


 
Reply With Quote
 
 
 
 
Randy Webb
Guest
Posts: n/a
 
      09-05-2006
(E-Mail Removed) 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/
 
Reply With Quote
 
80s.arcade@videotron.ca
Guest
Posts: n/a
 
      09-05-2006
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:
> (E-Mail Removed) 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/


 
Reply With Quote
 
80s.arcade@videotron.ca
Guest
Posts: n/a
 
      09-05-2006
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.

(E-Mail Removed) 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:
> > (E-Mail Removed) 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/


 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      09-05-2006
(E-Mail Removed) 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/
 
Reply With Quote
 
80s.arcade@videotron.ca
Guest
Posts: n/a
 
      09-05-2006
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:
> (E-Mail Removed) 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/


 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      09-07-2006
(E-Mail Removed) 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/
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DOCTYPE html PUBLIC and document.onmousemove Defacta HTML 3 12-18-2007 03:48 PM
onmousemove tracking works in IE - not in Firefox JJA Javascript 0 04-27-2007 06:48 PM
firefox onmousemove and dragging issues davefromalbury Javascript 8 01-13-2006 10:51 AM
[OT] Can't cancel .onmousemove in NN Csaba2000 HTML 6 09-17-2003 10:32 PM
Can't cancel .onmousemove in NN Csaba2000 Javascript 0 09-15-2003 06:41 PM



Advertisments