Clever Geek Handbook

JQuery tooltip adds content at the bottom of the page

I am using jQuery tooltip. The tooltip is displayed in the right place; He appears and disappears at the right moment. Everything seems to be working correctly. BUT When the toltip message appears, the content appears ALSO at the bottom of the page and it doesn't disappear anymore. Here's my code:

$(document).ready(function () {
    $(document).tooltip({
        items: "#img_help_easypay",
        show: {
            effect: "slideDown",
            delay: 250
        },
        content: function () {
            return "<span>Title</span><br />" +
                   "<p>" +
                   "   <span>bla bla bla</span><br />" +
                   "   <span>bla bla bla.</span>" +
                   "</p>"
        }
    });
});

Where img_help_easypay

is

<img id="img_help_easypay" src="/Styles/img/info.png" alt="aiuto easypay" style="vertical-align:top" />

Error not js ... Can anyone help me? Thank..

EDIT: At the bottom of the page, the div has role = "log"

+2


source to share


2 answers


According to this ticket from the jQuery UI bugs framework, this is a function run in jQuery UI 1.11.0 to improve accessibility: http://bugs.jqueryui.com/ticket/10689

If you want to completely remove the added one <div>

from your code, you need to destroy the tooltip:



$(document).tooltip( "destroy" );
+2


source


This is an accessibility feature. I just hide the divs I created:



 .ui-helper-hidden-accessible {
    display:none;
}
0


source






More articles:


All Articles