相关疑难解决方法(0)

动态定位Bootstrap工具提示(用于动态生成的元素)

我正在使用Twitter Bootstrap提供的工具提示(http://twitter.github.com/bootstrap/javascript.html#tooltips).

我的DOM中有一些动态插入的标记需要触发工具提示.这就是我以下列方式触发工具提示的原因(https://github.com/twitter/bootstrap/issues/4215):

$('body').tooltip({
    delay: { show: 300, hide: 0 },
    selector: '[rel=tooltip]:not([disabled])'
});
Run Code Online (Sandbox Code Playgroud)

为了避免工具提示放置得太靠近屏幕边缘,我需要能够根据触发工具提示的元素的位置动态设置它们的位置.我想到了以下方式:

   $('body').tooltip({
        delay: { show: 300, hide: 0 },
        // here comes the problem...
        placement: positionTooltip(this),
        selector: '[rel=tooltip]:not([disabled])'
    });



function positionTooltip(currentElement) {
     var position = $(currentElement).position();

     if (position.left > 515) {
            return "left";
        }

        if (position.left < 515) {
            return "right";
        }

        if (position.top < 110){
            return "bottom";
        }

     return "top";
}
Run Code Online (Sandbox Code Playgroud)

如何将currentElement正确传递给positionTooltip函数,以便为每个工具提示返回适当的放置值?

提前致谢

javascript jquery tooltip twitter-bootstrap

23
推荐指数
3
解决办法
4万
查看次数

标签 统计

javascript ×1

jquery ×1

tooltip ×1

twitter-bootstrap ×1