How to make Bootstrap popover Appear Disappear on hover instead of click

0 votes

Hii,

I'm building a website with Bootstrap's Popover and I can't figure out how to make the popover appear on hover instead of click.

  • All I want to do is have a popover appear when someone hovers over a link instead of clicking on it and for the popover to disappear when they move away. 
  • The documentation says it's possible using either the data attribute or jquery. I'd much rather do it with jquery since I have multiple popovers.
May 12, 2020 in JQuery by kartik
• 37,520 points
3,312 views

1 answer to this question.

0 votes

Hello @kartik,

Set the trigger option of the popover to hover instead of click, which is the default one.

This can be done using either data-* attributes in the markup:

<a id="popover" data-trigger="hover">Popover</a>

Or with an initialization option:

$("#popover").popover({ trigger: "hover" });

Thank You!!

answered May 12, 2020 by Niroj
• 82,840 points

Related Questions In JQuery

0 votes
1 answer

Twitter Bootstrap: How to see the state of a toggle button?

Hii @kartik, You can see what classes the ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
1,678 views
0 votes
1 answer

How to trigger a click on a link using jQuery

If you are trying to trigger an ...READ MORE

answered Jun 3, 2022 in JQuery by Edureka
• 13,690 points
16,418 views
0 votes
1 answer

How to trigger a click on a link using jQuery

$( "#foo" ). trigger( "click" ); As of jQuery ...READ MORE

answered Jun 10, 2022 in JQuery by rajatha
• 7,680 points
726 views
0 votes
1 answer

How to trigger a click on a link using jQuery

Use the jQuery click() Method You can use ...READ MORE

answered Jun 10, 2022 in JQuery by rajatha
• 7,680 points
1,724 views
0 votes
1 answer

Uncaught Error: Bootstrap's JavaScript requires jQuery

Hello @kartik, You have provided wrong order for ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
23,295 views
+1 vote
2 answers

How to set cache false for getJSON in jQuery?

You can't pass any configuration parameters to ...READ MORE

answered Oct 7, 2020 in JQuery by Amit
• 140 points
2,931 views
0 votes
1 answer

From php returning JSON to JavaScript

Hii @kartik, You can use Simple JSON for PHP. ...READ MORE

answered Jun 5, 2020 in Java-Script by Niroj
• 82,840 points
1,017 views
0 votes
1 answer

How can I compare two dates in PHP?

Hello @kartik, If all your dates are posterior ...READ MORE

answered Aug 27, 2020 in PHP by Niroj
• 82,840 points
1,574 views
0 votes
1 answer

How to enable Bootstrap tooltip on disabled button?

Hii @kartik, You can wrap the disabled button ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
5,101 views
0 votes
1 answer

How to close all active bootstrap modals on session timeout?

Hello @kartik, Use the following code: $('.modal').modal('hide'); Also if you ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
8,389 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP