Как перенести подсказку qtip2 в другой элемент?

Question

У меня есть элемент с всплывающей подсказкой qtip2. См. Пример JSFfiddle: http://jsfiddle.net/inodb/y7xqvceL/2/. Элементом в примере является элемент <a id="test">. Я хочу переместить указанную подсказку на другой элемент <a id="test2"> программно. Я полагаю, я должен либо

1. обновления цели существующей подсказки или
2. скопировать все параметры оригинала и создать новый QTIP на втором анкерный элементе поставляя всех этих варианты

контекст к проблеме заключается в том, что у меня есть библиотека, которая показывает подсказки при наведении на SVG <circle> элементов. Я хочу обернуть эти круги в тег <g>, чтобы я мог поместить на круг <text>. Однако всплывающая подсказка работает только на круге, поэтому, если вы наводите курсор на текст, всплывающая подсказка не отображается. Я решил перемещать всплывающую подсказку qtip2 из элемента <circle> в элемент <g>.

Answer 1

Когда я повторно использую всплывающие подсказки qtip2 &, я считаю полезным создать функцию, которая генерирует или уничтожает всплывающую подсказку.

Fiddle:http://jsfiddle.net/y7xqvceL/8/

//custom function to create tooltips with similar options or destroy them 
function GenerateTooltip(tooltipElement, isCreating) { 
    //if creating the tooltip, use these options 
    if (isCreating) { 
     $(tooltipElement).qtip({ 
      content: { 
       text: 'Tooltip content that should be moved', 
      }, 
     }); 
    } else { 
     //if isCreating == false, destroy the tooltip specified 
     tooltipElement.qtip('destroy', true); 
    } 
} 
//... 
GenerateTooltip($("#test"), false); //first destroy old tooltip 
GenerateTooltip($("#test2"), true); //create new tooltip 

Если это слишком сложно, или эта операция требуется только один раз произойти, я бы рекомендовал разрушив первую подсказку и создания нового вручную.

Fiddle:http://jsfiddle.net/y7xqvceL/9/

//this button click moves the tooltip to the other element 
$("#move-tt").click(function() { 
    $('#test').qtip('destroy', true); //destroy old tooltip 

    $("#test2").qtip({ //create new tooltip 
     content: { 
      text: 'Tooltip content that should be moved', 
     }, 
    }); 
});