Wiążąca pozycja popup do aktywnego pola tekstowego

Question

Próbuję dowiedzieć się, jak ustawić górne i lewe wartości w stosunku do selected_element (aktywne w momencie wyskakiwania wyskakujących okienek) podobne do etykiety narzędzia. Próbowałem używać $(). Position() z jQuery, ale to nie zastępuje domyślnego 0,0, które ustawiłem z CSS.

Oto JSFiddle: https://jsfiddle.net/sethkillian2/cd6agg73/3/ Przytrzymaj a, c, e, i, o lub u, aby otworzyć menu.

Również tutaj jest częścią mojej próbie:

$(popup).position({ 
    of: $(activeElement), 
    my: 'left top', 
    at: 'left top', 
    offset: '0 0' 
}); 
$('body').append(popup); 

Zmiana atrybutu pozycji do niczego oprócz absolutna nie wydają się działać albo ponieważ wówczas menu znak rozszerza. Próbowałem również uzyskać element po identyfikatorze bezpośrednio po dodaniu go za pomocą $ ("# charMap"). Position (...).

Aktualizacja: Dla tego, co jest warte, próbowałem również użyć komponentu textarea-caret-position (https://github.com/component/textarea-caret-position), ale nie wydaje się to być dokładne.

Answer 1

Właściwości margin-top i margin-left są ustawione na #ta w CSS; można użyć .css() pobrać i ustawić te same właściwości popup

$(popup).css($(activeElement).css(["marginTop", "marginLeft"])); 

jsfiddle https://jsfiddle.net/cd6agg73/9/