在live上更改jQuery Tipsy插件重力

时间:2013-07-16 11:04:22

标签: javascript jquery jquery-plugins tipsy

我正在使用jQuery Tipsy plugin,我想知道是否可以动态改变引力。

我一直在尝试但没有成功:http://jsfiddle.net/YSYuu/

以下是代码:

$('[data-demo]').tipsy({
    title: 'data-demo',
    gravity: 'n'
});

//changing it on real time
$('.demo').click(function () {
    $('[data-demo]').tipsy({
        title: 'data-demo',
        gravity: 's'
    });
    alert("Gravity changed");
});

3 个答案:

答案 0 :(得分:2)

问题在于,在特定元素上为了速度而绑定事件,并且在插件中没有unbind事件。你能做的就是克隆你的元素;它可能是唯一的方法。 (插件限制)。

以下是解决方案:

$('.text').tipsy({
    title: 'data',
    gravity: 's'
})


$(".demo").on("click", function(){
    $(".text").remove().clone().appendTo("body").tipsy({
       title: 'data',
       gravity: 'n'
    })

});

JSFiddle:http://jsfiddle.net/javascript/YSYuu/3/

当然,你会追加到它所在的完全相同的位置。要获取其位置,您可以使用$(this).parent().children().index(this),然后附加$("#whatever li:eq(2)").after("...");

答案 1 :(得分:1)

克隆元素,然后删除原始元素。并添加具有更改重力的克隆,如下所示:

$('.demo').click(function () {
    var el = $('[data-demo]');
    var clone = $(el.clone());
    el.before(clone);
    el.remove();
    clone.tipsy({
        title: 'data-demo',
        gravity: 's'
    });
    alert("Gravity changed");
});

<强> jsFiddle

答案 2 :(得分:1)

您可以通过访问tipsy的配置数据来创建工具提示后更改重力:

$('[data-demo]').data('tipsy').options.gravity = 's';

我测试了gravitytitle效果良好:http://jsfiddle.net/mikeular/h5y14qe3/6/