Jquery popover on hover stay active so that the content is clickable

Question

On hover of bootstrap popover, the content is not clickable. The popover disappears immediately after hover.

<div class="cin-help" ng-if="!isCinUser">
    <strong><span>Sevrity</span></strong>
    <span ng-show="isHelpTextShown" class="icon-question-circle icon-color text-large cursor-ptr" id="sev1-help" data-trigger="hover" popover-placement="right" data-toggle="popover" data-original-title='' title='' popover-html="sev1-Note" ></span>
    <div class="hide" id="sev1-Note" ng-show="isHelpTextShown"><span ><a href=&quot;http://docs.aws.amazon.com/AWSEC2/latest/UserGuide/placement-groups.html&quot; target=&quot;_blank&quot;>Click here...</a></span></div>
</div>

The Js code for it is:

$(document).ready(function(){
    $('#simplified-form').on('hover','#sev1-help',function(){
        $('#sev1-help').popover({
            html:true,
            content: function() {
                return $('#sev1-Note').html();
            }
        }); 
   });
});

I'm unable to get the popover stay on hover so that the link inside is clickable. Can anyone suggest a method?

Where are the `#severityHelp` and all other `div`s? Also, popover should work, see this [answer](https://stackoverflow.com/a/20299785/863110) — Mosh Feu, Aug 14 '17 at 09:04
The popover works, it comes up but disappeard immediately, I want it to stay on hovering on the popover so that user can click the link inside. — Archana Ramachandran, Aug 14 '17 at 09:35
@ArchanaRamachandran Try this code `$(document).ready(function(){ $('#simplified-form').on('hover','#sev1-help',function(){ $('#sev1-help').popover({ html: true, trigger: 'hover', container: '#sev1-help', placement: 'right', content: function() { return '
Google
' } }); }); });` — Santosh Hegde, Aug 14 '17 at 13:06

Jquery popover on hover stay active so that the content is clickable

0 Answers0