Can you make a browser display an HTML title attribute after setting it dynamically?

2
votes

I need to be able to show what would appear to be a tooltip when the user hovers over an element, but the text I need to display is only known after the user hovers, which triggers an ajax call to a server to get the text to be displayed, which I then set as the title attribute of the element.

Since there was no title attribute when the user began hovering over the element, no tooltip is displayed, even after I set the title. I have to mouse off the element and then back onto it before the tooltip appears.

Is there any way to force or fake the browser into displaying the tooltip after I've set the title attribute?

3
javascripthtmltooltiptitle
Is there any way to force or fake the browser into displaying the tooltip... Title tooltip is only displayed when mouse cursor is over the element. You cannot force browser to display tooltip on your request. The only way in your case is use custom tooltips. - hindmost

3 Answers

0
votes

Using jquery .on( "mouseover", handler ) event you can add a span with .fadeIn()

You just have to make it look like a tooltip with css

0
votes

Here are some bootstrap tooltip examples from w3schools bootstrap tool tip might help you, 

<script>
    $(document).ready(function(){
        $('[data-toggle="tooltip"]').tooltip();   
    });
</script>
0
votes

I had the same issue and at the end, I used Bootstap's tooltip:

$('#element').tooltip('show')