[jQuery] Re: continuous action while mouseover

[Alexandre Plennevaux]

hi brian,
 
i just found out you are the one behind the excellent hoverIntent plugin! i 
will change my code to use your plugin and follow your advises, although some 
of which may have me posting again on this list soon :).
 
thanks much!
 
alexandre

   _____  

From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Brian 
Cherne
Sent: mercredi 17 octobre 2007 17:35
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: continuous action while mouseover


OnMouseOver
- capture initial position
- start onMouseMove listening

OnMouseMove
- capture mouse postion

OnMouseOut
- stop onMouseMove listening

Note 1) OnMouseMove is a very cpu-expensive event. It literally fires with 
every tiny little move of the mouse. You'll want to you have onMouseMove 
handler very very simple to keep from maxing out the user's cpu. If possible, 
you may consider having onMouseMove store just mouse coordinates and use a 
self-calling timer to do any additional math/logic with those coordinates. The 
fastest timer (~13ms) is still much better (more cpu-friendly) than 
onMouseMove. 

Note 2) You may consider using hover instead of onMouseOver/onMouseOut ... 
unless you only have the one object and won't have to worry about executing 
onMouseOver with every crease in the DOM structure.

I hope this helps.

Brian.


On 10/17/07, Alexandre Plennevaux <HYPERLINK "mailto:[EMAIL PROTECTED]"[EMAIL 
PROTECTED]> wrote: 


Hi friends,

i was wondering: how can i trigger an action while the mouse stays on a 
specific area of the screen? 

i tried the following code: it works ONCE (when the mouseover event is 
triggered) but not continuously, while the mouse i over my "active" zone.

var centerX = $('#datascape').width()/2;
stepX = 240;
var $datascapeViewport = $('#ds-viewport');
$datascapeViewport.css({position: 'relative',left: 0+'px'})
.bind('mouseover',function(e){
        var minX = $(this).width(); 
        minX=-minX;
        var maxX = 0;
        var newLeft = 0;
        var Position = $(this).offset();
        if (e.pageX >= centerX) {
                newLeft = Position.left-stepX;
        } else 
        {
                newLeft = parseInt(Position.left) + stepX;
        }
        //alert("\nposition.left="+Position.left 
+"\nnewLeft="+newLeft+"\nstepX="+stepX);
        newLeft = -newLeft; 
        if ((newLeft<maxX) && (newLeft>minX)) {
        $(this).animate({left: newLeft+'px'},1000);
        }
});

just for background, i'm trying to have a very wide image scroll horizontally 
according to the mouse position on the X axis, center being no scroll, left 
position meaning scroll image right, and invertedly. 


Thanks for your insight!

Alexandre

Ce message Envoi est certifié sans virus connu.
Analyse effectuée par AVG.
Version: 7.5.488 / Base de données virus: 269.14.13/1074 - Date: 16/10/2007 
14:14 






Ce message Envoi est certifié sans virus connu.
Analyse effectuée par AVG.
Version: 7.5.488 / Base de données virus: 269.14.13/1074 - Date: 16/10/2007 
14:14