Question

184

How to open a popover on the mouse click location

rated 0 times [ 186] [ 2] / answers: 1 / hits: 15955 / 11 Years ago, wed, february 20, 2013, 12:00:00

I have loaded an image on my HTML page and I'd like to open a popover from Twitter Bootstrap right over the mouse click position.
What I have done so far is to open the popover on the side of the image. But what I really want to do is to open the popover wherever I've clicked on the image.

How can I achieve this?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

stefanicarolinat

Add To Favorites

Follow

Total Points: 145

Total Questions: 91

Total Answers: 93

Location: Cambodia

Member since Thu, Oct 7, 2021

3 Years ago

stefanicarolinat questions

1 Cannot fetch data from localhost using Sveltekit

Mon, Nov 15, 21, 00:00, 3 Years ago

1 Add nonce to script tag

Fri, Apr 16, 21, 00:00, 3 Years ago

1 How do you input an ASCII art image into the console in JS?

Thu, Oct 15, 20, 00:00, 4 Years ago

1 jest: How to teardown after (just) an individual test

Fri, Jul 17, 20, 00:00, 4 Years ago

1 How to run code (Google/Doubleclick Ads) without block main thread

Tue, Nov 26, 19, 00:00, 5 Years ago

View All

answered 11 Years ago hector · Accepted Answer

You need to get the mouse coordinates and make your script use them to position the popover on click. If you're using jQuery this might help:

$('#yourimage').click(function(){

      $('#popover').css('left', pageX-(popover width)+'px');

      $('#popover').css('top', pageY-(popover height)+'px');

})

---EDIT---

Here's a demo of what you're after.