1

Can anyone help me that how can I grab that event when mouse enter from left side or right side not from anywhere to specific area in Javascript.I got code for coordinates but that's not solve my issue.For x,y coordnates i use this chunk of code

tempX = e.pageX
tempY = e.pageY

Thanks in advance

1
  • Any possible solution will work only when mouse is moved relatively slow, otherwise you'll receive only few points from pointer's path, and there will be no possibility to restore full path and find its direction.
    – Victor
    Dec 11, 2012 at 19:37

2 Answers 2

1

You are on the right track

using

​document.observe("mousemove",function(e){
    console.log("X: "+e.pointerX()+", Y: "+e.pointerY()); 
});​​​​​​​​​​​​​

it gets the X and Y coordinates of the mouse on the document

I would check if any of the X is less than 10 - to give a little error room and then run code based on coming in from the left side and make sure you set a flag that you are handling it - otherwise you will have multiple calls to the same handler.

the right side is a little more tricky as you need to know how wide the screen is and then add a little error on the right side as well.

4
  • the question was tagged with prototypejs which is the PrototypeJS Framework Dec 10, 2012 at 5:38
  • What is the difference between "pointerX" and "pageX" (other than the first being a Prototype.js property and the second being standard javascript)? Note that the OP is already using pageX.
    – RobG
    Dec 10, 2012 at 5:40
  • pageX might not be available cross browser - PrototypeJS's pointerX() makes it cross-browser and available for all browsers that PrototypeJS supports. For instance only IE9 and later support pageX and you can't ignore IE8 users unless you are in a captive environment. Dec 10, 2012 at 5:45
  • Hi Geek thanks for the help i agree with your answer but i think rai.skumar answer is suitable for current situation ,because if i mouse enter the same coordnates like in my code (X(129,323) Y(152,482)) ,It will always call my code eihter i come from right or left ,top or bottom,I have to set some hidden field like div on left or right and when user hover that area and than my code runs else not ? what you suggest.Thanks for your help Dec 10, 2012 at 5:48
1

You can try this(might not be an optimized approach) :

Have a hidden/invisible div on left as well right side of page. Like a long strip which covers the whole page. And once mouse over event is triggered on these div, you can make corresponding flag true in respective cases.

so if leftFlag is true --> do the necessary

do similar exercise of righFlag.

Note : Making opacity very low (opacity: .01) makes div invisible. And event also gets triggered.

5
  • 2
    Hidden divs don't get mouse events, but even with a visible "border" div to the left and right remember that the user may move the mouse really quickly such that logically it has passed across the "border" div, but in practice the "border" didn't receive a mousemove event.
    – nnnnnn
    Dec 10, 2012 at 6:05
  • Sorry rai the JS event not working with hidden fields like div.Thanks for your suggestion Dec 10, 2012 at 6:39
  • yeah hide will not work as suggested by @nnnnnn. Try by making opacity as very low (opacity: .01). This way it works.
    – rai.skumar
    Dec 10, 2012 at 6:46
  • Yeah rai its works but also it occupy area and i dont want that,because in one page i have multiple area's where i put this div and it will disturb my layout.Any other option ? Dec 10, 2012 at 6:59
  • you can put one div on top of other by varying z-index. Make this div float on top of other divs by making z-index very high like 999.
    – rai.skumar
    Dec 10, 2012 at 7:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.