Cursor Position.
Moderator: General Moderators
Cursor Position.
How do I get the position of the cursor on my web page using JavaScript? The x and y?
Code: Select all
window.onmousemove = function(e) {
e = e || window.event;
window.status = 'X: ' + e.clientX + ' Y: ' + e.clientY;
}
This is good stuff, thank you. But why do you use the or operator in this line:
I don't understand. You can use the or operator in an if statement and I understand that that is basically making two possible conditions. But with this I don't understand how it works. Why would e not equal e and instead equal window.event? Please explain.
Code: Select all
e = e || window.event;- Chris Corbyn
- Breakbeat Nuttzer
- Posts: 13098
- Joined: Wed Mar 24, 2004 7:57 am
- Location: Melbourne, Australia
The code posted is a very neat and compact version of this (literally expanded):EasyGoing wrote:This is good stuff, thank you. But why do you use the or operator in this line:
I don't understand. You can use the or operator in an if statement and I understand that that is basically making two possible conditions. But with this I don't understand how it works. Why would e not equal e and instead equal window.event? Please explain.Code: Select all
e = e || window.event;
Code: Select all
function somefunc(e)
{
if (!e) e = window.event;
window.status = 'X: ' + e.clientX + ' Y: ' + e.clientY;
}
window.onmousemove = somefunc;
Okay I understand. But when you say "Not all browsers pass the event information to the callback function hence the check for the value of e." I don't understand. What's the event information and the callback function?d11wtq wrote:The code posted is a very neat and compact version of this (literally expanded):EasyGoing wrote:This is good stuff, thank you. But why do you use the or operator in this line:
I don't understand. You can use the or operator in an if statement and I understand that that is basically making two possible conditions. But with this I don't understand how it works. Why would e not equal e and instead equal window.event? Please explain.Code: Select all
e = e || window.event;
Not all browsers pass the event information to the callback function hence the check for the value of e.Code: Select all
function somefunc(e) { if (!e) e = window.event; window.status = 'X: ' + e.clientX + ' Y: ' + e.clientY; } window.onmousemove = somefunc;
What does it mean when you specify "e" as a parameter in a function? Is this a reserved keyword of somesort? Cause wouldn't you have to write "somefunc(somevalue_for_e)"?
I thank you for all your answers.
event information is... well, it's information about the eventWhat's the event information and the callback function?
No, it's not a reserved word, using 'e' as a parameter name for event handlers is just a tradition.What does it mean when you specify "e" as a parameter in a function? Is this a reserved keyword of somesort?
You wouldn't because browser does that for youCause wouldn't you have to write "somefunc(somevalue_for_e)"?
|| operator in Javascript behaves differently to what you might be accustomed to in languages like C or PHP. While in these languages it returns Boolean value, in Javascript it:
So it could be used to specify default argument values (something that Javascript does not allow in a usual way):MDC wrote: Returns expr1 if it can be converted to true; otherwise, returns expr2.
Code: Select all
function ExampleFunc(firstParam, secondParam) {
firstParam = firstParam || 'default value for firstParam';
secondParam = secondParam || 'default value for secondParam';
// now both the firstParam & secondParam are guaranteed
// to be initialized, even if the function was called like this
// ExampleFunc('non default value for firstParam'); // note that secondParam was not passed in
}
Code: Select all
e = e || window.event;
Oh I see. It's like this in php:
Basically setting a default for the e parameter so that you don't have to give it a value. But is this an option:
???
Code: Select all
function whatever(e = "the default value(in this case window.event).");Code: Select all
function whatever(e = window.event)
{
//then the code in here..
}- Chris Corbyn
- Breakbeat Nuttzer
- Posts: 13098
- Joined: Wed Mar 24, 2004 7:57 am
- Location: Melbourne, Australia
EasyGoing wrote:Meh it didn't work.
Code: Select all
function mytest(foo='bar')
{
alert(foo); //No... this causes error
}Code: Select all
function myTest(foo)
{
if (foo == null) foo = 'bar';
alert(foo); //bar
}