We can get the popover by placing the hover on element
<head> <script type="text/javascript"> $(document).ready(function () { $(".popover-pop a").popover({ trigger: 'hover', }); }); </script> </head> <body> <h2>Popover with hover</h2> <div> <ul class="popover-pop list-inline"> <li><a href="#" class="btn btn-warning" data-toggle="popover" title="Forums" data-content="Resolved Posts">DotNetFunda</a></li> <li><a href="#" class="btn btn-danger" data-toggle="popover"title="Step by step" data-content="Tutorials">TechFunda</a></li> </ul> </div> </body>
popover-pop
in the ul element and we have defined the list values with anchor tag, we have two buttons with different values using data-toggle
as popover, with title
and data-content
$(".popover-pop a").popover({})
to call the popover
in the body section and the function trigger: 'hover',
is used to get the popover when the mouse is placed on the elementoutput
Views: 7080 | Post Order: 49