Get element position relative to moniter with javascript

Question

Is there a way to get the position of an element (let's say a button) relative to the entire monitor, not just the page I'm working with? All solutions I've found so far find can find the position of the element on the page, but I'm wondering if I can tell where the button is on the screen as a whole, not just my page.

Answer 1

including taskbars:

window.screen.availHeight  
window.screen.availWidth

not including

window.screen.width   
window.screen.height

supported on all major mobile devices so if you know where the taskbars sit, its a simple calculation to figure out the difference.... then apply it to jquerys offset function:

$('#myElement').offset().top   
$('#myElement').offset().left

or raw js:

var myElement = document.getElementById('myElement');

myElement.offsetTop
myElement.offsetLeft

hope this helps! :)

Answer 2

You cannot know where the browser is in the operative system render. Some browsers support it but it's not guaranteed this will work everywhere. And in those that support it there are multiple edge cases that you can't control (like multiple monitors)