JSFiddle - React, Tailwind, and code Playground
HTML
<input type="button" value="Hello" id="hello" /><br />
<input type="button" value="World" id="world" />
<input type="button" value="Hello again" id="again" />
CSS
#hello{
position: fixed;
top: 150px;
height: 10px;
width: 50px;
left: 0px;
}
JavaScript
(function ($) {
$.fn.fixedPosition = function () {
var offset = this.offset();
var $doc = $(document);
return {
'x': offset.left - $doc.scrollLeft(),
'y': offset.top - $doc.scrollTop()
};
};
})(jQuery);
$('#hello').click(function () {
var pos = $(this).fixedPosition();
console.log(pos);
});
$('#world').click(function () {
var pos = $(this).fixedPosition();
console.log(pos);
});
$('#again').click(function () {
var pos = $(this).fixedPosition();
console.log(pos);
});