我目前正在我的网站上实施Qtip2工具提示,他们的工作非常好.
但是,我需要在每个元素的基础上设置工具提示的位置.为此,我设置了几个这样的data属性:
<img src="/images/help-icon.png"
class="tooltip"
title="Lorem ipsum dolor sit amet consectetur adipiscing elit"
data-tooltip-my-position="right center"
data-tooltip-target-position="left center" />
Run Code Online (Sandbox Code Playgroud)
我已经尝试使用函数来获取数据属性,但似乎my和at属性不接受函数,因为这只是将工具提示放在右下角/左上角,这似乎是默认定位.
$(this).find('.tooltip').qtip({
show: {
event: 'mouseenter click'
},
position: {
my: function() {
return $(this).data('tooltip-my-position'); // doesn't work
},
at: function() {
return $(this).data('tooltip-target-position'); // doesn't work
}
}
});
Run Code Online (Sandbox Code Playgroud)
我查看了文档,但似乎没有关于在初始化时或初始化后以编程方式设置定位属性的指导.
有谁知道我想做什么是可能的,如果是的话,怎么样?
Ror*_*san 11
我刚刚发布了一个解决方案,通常就在我发布之后.
我将一个函数连接到show事件,该事件将目标元素作为参数传递,然后我可以从中获取data属性:
$(this).find('.tooltip').qtip({
show: {
event: 'mouseenter click'
},
events: {
show: function(event, api) {
var $el = $(api.elements.target[0]);
$el.qtip('option', 'position.my', $el.data('tooltip-my-position') || 'right center');
$el.qtip('option', 'position.at', $el.data('tooltip-at-position') || 'left center');
}
}
});
Run Code Online (Sandbox Code Playgroud)
我将在这里留下这个答案,以防将来对某人有用.