仪表盘上的jQuery UI工具提示位置

我正在使用内置WordPress内置jQuery UI工具提示（jQuery UI工具提示）。我的问题是控制屏幕上的工具提示位置，当前它会在帮助dashicon的上方弹出，但它也会在图标上方大约100px处出现。图标本身位于与中心动态对齐的div中。它需要固定在图标上方，而不是跳转页面。

所需的脚本和样式随以下内容一起添加。

wp_enqueue_script(\'wpb-tooltip-jquery\', plugins_url(\'/js/um-tooltip.js\', __FILE__ ), array(\'jquery-ui-tooltip\'), \'\', true);
wp_enqueue_style(\'wpb-tooltip-css\', plugins_url(\'/css/um-tooltip.css\', __FILE__), false, null);
wp_enqueue_style( \'dashicons\' );

um工具提示。css

.ui-tooltip {
    background: #356aa0;
    border: 1px solid white;
    position: relative;
    padding: 10px 20px;
    color: white;
    border-radius: 3px;
    font: bold 14px "Helvetica Neue", Sans-Serif;
    box-shadow: 0 0 7px #356aa0;
    max-width:350px;
}

um工具提示。js公司

jQuery( document ).ready(function($) {
    jQuery(\'#kaini_pass_info\').tooltip({
        content: "\'Good\' or better on strength meter.<br />" +
            "Password must not be a dictionary word,<br />" +
            "name or keyboard pattern.<br />" +
            "Tips for better passwords :<br />" +
            "Be lengthy (8 or more characters),<br />" +
            "contain uppercase letters (A-Z),<br />" +
            "lowercase letters (a-z), digits (0-9),<br />" +
            "and special characters (&,\'^!.\\"*[]+- etc)"
    });
});

HTML

<a id="kaini_pass_info" href="#" title=""><span class="dashicons dashicons-editor-help"></span></a>

小码农CODE

相关推荐

jQuery .html rendering