Positioning a popup keyboard - jquery-ui

Question

I found a plugin from github that pops out a virtual keyboard as you click a textbox/textarea. The problem is, if you have other elements, the keyboard appears at the bottom. I want it to show adjacent the textbox clicked. I tried appending ".position({
my: "left top",
at: "left top",
of: "#targetElement"
});" at the end of the keyboard initializer(last line) but it's not taking effect. Here's the script.
<script type="text/javascript">
$(function(){
var keyboard = {
'layout': [
// alphanumeric keyboard type
// text displayed on keyboard button, keyboard value, keycode, column span, new row
[
[
['`', '`', 192, 0, true], ['1', '1', 49, 0, false], ['2', '2', 50, 0, false], ['3', '3', 51, 0, false], ['4', '4', 52, 0, false], ['5', '5', 53, 0, false], ['6', '6', 54, 0, false],
['7', '7', 55, 0, false], ['8', '8', 56, 0, false], ['9', '9', 57, 0, false], ['0', '0', 48, 0, false], ['-', '-', 189, 0, false], ['=', '=', 187, 0, false],
['q', 'q', 81, 0, true], ['w', 'w', 87, 0, false], ['e', 'e', 69, 0, false], ['r', 'r', 82, 0, false], ['t', 't', 84, 0, false], ['y', 'y', 89, 0, false], ['u', 'u', 85, 0, false],
['i', 'i', 73, 0, false], ['o', 'o', 79, 0, false], ['p', 'p', 80, 0, false], ['[', '[', 219, 0, false], [']', ']', 221, 0, false], ['\', '\\', 220, 0, false],
['a', 'a', 65, 0, true], ['s', 's', 83, 0, false], ['d', 'd', 68, 0, false], ['f', 'f', 70, 0, false], ['g', 'g', 71, 0, false], ['h', 'h', 72, 0, false], ['j', 'j', 74, 0, false],
['k', 'k', 75, 0, false], ['l', 'l', 76, 0, false], [';', ';', 186, 0, false], [''', '\'', 222, 0, false], ['Enter', '13', 13, 3, false],
['Shift', '16', 16, 2, true], ['z', 'z', 90, 0, false], ['x', 'x', 88, 0, false], ['c', 'c', 67, 0, false], ['v', 'v', 86, 0, false], ['b', 'b', 66, 0, false], ['n', 'n', 78, 0, false],
['m', 'm', 77, 0, false], [',', ',', 188, 0, false], ['.', '.', 190, 0, false], ['/', '/', 191, 0, false], ['Shift', '16', 16, 2, false],
['Bksp', '8', 8, 3, true], ['Space', '32', 32, 12, false], ['Clear', '46', 46, 3, false], ['Cancel', '27', 27, 3, false]
]
]
]
}
$('#name.jQKeyboard').initKeypad({'keyboardLayout': keyboard});
});
</script>

Answer 1

If we're talking about: https://github.com/poiyee/jQKeyboard then I would suggest:
$('#name.jQKeyboard').initKeypad({'keyboardLayout': keyboard});
$('#jQKeyboardContainer').position({
my: "left top",
at: "left top",
of: $('#name.jQKeyboard')
});
The plugin is written in an older fashion and I would suggest or consider using $.widget() to write you're own that allows you to set the position as an option.
If you wanted a modern working widget, it would look like this: https://jsfiddle.net/Twisty/mzj9w2yb/4/