I am trying to set the position of a contextMenu and using Jquery jquery.ui.position. For ContextMenu I am using this libaray:-
https://swisnl.github.io/jQuery-contextMenu/demo
I am trying to position a ContextMenu as follow:-
$(document).ready(function() {
$.contextMenu({
selector: 'td[id="tdMenu"]',
trigger: 'left',
position: function (opt, x, y) {
try {
opt.$menu.position({
my: 'right top',
at: 'right bottom',
of: $("#tdDiv")
});
} catch (e) {
}
},
items: {
"0": { name: "Hi" },
}
});
});
HTML is as follow:-
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td id="tdDiv" style="background-color: yellow;">
Menu Div
</td>
</tr>
<tr>
<td id="tdMenu">
Click Here
</td>
</tr>
</table>
In IE 11 once the page will load and once I click on td with id tdMenu jquery.ui.position does not calculate the offset correctly. On second click it calcultes correctly.
What I have found is inside jquery.ui.position its calculating a offset as follow:-
function getDimensions( elem ) {
var raw = elem[0];
return {
width: elem.outerWidth(),
height: elem.outerHeight(),
offset: elem.offset() // On first click its calculating wrong value and on second it calculates correctly.
};
}
I have also given margin to body as:-
<body style="margin: 0px;">
If I will remove this margin it calculates correctly on first click also.
I cannot remove body margin. What can be the work around for this ?
from Jquery offset is not giving the expected value if margin is used on body element in IE
0 komentar:
Posting Komentar