how do you fix position on trigger

Seen the demo but still can't fix position to trigger.

I want the tooltips bottom right corner to open over the trigger (tooltip appearing left and over trigger).
To achieve this I set in the css:
.snp-mouseoffset, .snp-triggeroffset, .snp-mousetrack  {
margin-left: -239px;
margin-top:  -149px;
}

which  works fine whilst there is enough space to the right upto the end of the browser window. but when there is less than 239px to browser edge the tooltip opens further in the page which looks very odd.

Is there another way of of achieving what I want (a tooltip opening to left and over trigger ) even when trigger is found close to the right of the browser window.

I'm afraid I'm no expert when it comes to Javascript so don't really know what reference to x and y will make the tooltip perform as I want it to.
However I have tried changing all the references within supernote.js (whilst removing margin-left: -239px;
margin-top: -149px;  from css code.

No changes seem to effect the tooltip except when I add a value to 'px' inchange:
 note.ref.style.left = checkWinX(mouseX, note) + '20px'; //for an example note.ref.style.top = checkWinY(mouseY, note) + 'px';

and  that just throughs thing out.
Could you help and point me in the right direction (A fairly decent point)
Regards
Bangers

Works a treat,
Thanks for the help.
Regards
Bangers