工具提示不会根据窗口大小进行调整

时间:2015-09-11 11:34:22

标签: javascript jquery

我正在使用Tipped插件进行工具提示..我之前使用的插件是ace admin pluginTipped,但问题是它不会根据窗口大小调整位置。在免费提示版本中,一些功能不存在.. 我得到的主要问题是我在加载时设置工具提示并在检查条件后我尝试更改它但它显示两个工具提示

代码:

var a=document.createElement('a');
a.setAttribute('id','23_34');
a.setAttribute('title', 'Transcription ID: ');  

 if (data == true) {
Tipped.remove("#23_45");
Tipped.create("#23_45", $('<p/>').html('Transcription ID:
}

它显示两个工具提示都没有删除第一个..任何人都有解决方案或建议我根据窗口高度自动调整位置的任何工具提示?

1 个答案:

答案 0 :(得分:2)

如果您不想使用任何插件进行工具提示,只需 CSS ,这个答案可能有所帮助。

<强> HTML:

<a href="" class="tooltip_custom" data-title="text on hover"></a>

<强> CSS:

.tooltip_custom{
    display: inline;
    position: relative;
}
.tooltip_custom:hover:after{ 
    background: #333; 
    background: rgba(0,0,0,.9); 
    border-radius: 5px; bottom: 26px; 
    color: #fff; font-size: 12.2px; 
    content: attr(data-title); 
    left: 113%; 
    bottom:-30%; 
    padding: 4px 7px; 
    position: absolute; 
    z-index: 500000000; 
    width: auto; 
} 
.tooltip_custom:hover:before{ 
    border: solid; 
    border-color: #333 transparent; 
    border-width: 6px 6px 0 6px; 
    bottom: 5px; 
    transform:rotate(90deg); 
    left: 100%; content: ""; 
    position: absolute; 
    z-index: 5000000001; }