jQuery Tipsy:简单的覆盖解决方案?

时间:2012-03-26 22:20:22

标签: jquery click mouseover tipsy

如何在不丢失测试文本且不克隆测试文本的情况下将方向从“n”更改为“w”?

$(".tipsy").live('mouseover',function() {
    $(this).tipsy({gravity: "n", html: true});
    $(this).tipsy("show");
});

$(".tipsy").live("click",function() {
    $('.tipsy').remove();
    $(this).tipsy({gravity: 'w', html: true});
    $(this).tipsy("show");
});

<div class="tipsy" title='<u>test link</u>'>TestTestTestTestTestTestTestTestTestTestTest</div>

这是一个小提琴:http://jsfiddle.net/nQvmw/23/

1 个答案:

答案 0 :(得分:2)

在tipsy插件主页中看到,您可以传递一个返回方向作为重力选项的函数:

$(el).tipsy({gravity: function(){return Math.random()>.5 ? 'w' : 'n';}

基于此功能,您可以轻松创建一个函数,为不同的鼠标操作返回不同的方向(mouseenter,click ...):

var flag = false;
function gravity(){
    return flag ? 'n' : 'w';
};

$(".tipsy")
    .live('mouseover',function(){
        flag = true;
        $(this).tipsy("show");
    })
    .live("click",function() {
        flag = false;
        $(this).tipsy("show");
    })
    .tipsy({
        gravity: gravity,
        html: true
    });

这是working demo