is there any way to "wait for user action on popupmenu" after an element is clicked ?
for example:
person A clicks on link. javascript menu popups asking what the user would like to do with this link. user should not be allowed to click anywhere else but the popup menu. after user clicks an action on the menu, the default browser action should happen (ie. link to the next page)
Do you mean something like this?
<a href='target.html' onclick='javascript:return confirm("Are you sure that you want to continue?");'>click to navigate</a>
I guess you're asking for a select element in a modal dialog. If so, use jqueryUI as you're already using jquery.
You'll have to either build your menu dynamically or include it in the page with style display:none;.
Then, when you click the link, you'll have to set the x/y according to the event's position.
e.g.
$(document).ready(function() {
$('a#mylink').click(function(ev){
var menu = $('div#myMenu').get(0);
var leftPt = ev.pageX + 'px';
var topPt = ev.pageY + 'px';
menu.style.display= "block";
menu.style.left= leftPt;
menu.style.top= topPt;
});
});
However, then you'll have to worry about closing the menu after a certain length of time or applying a "close" button/link.
I was always wondering how to do this very same type of popup, so a few months ago I wrote an extension for Google Chrome that shows some options when you select text. It does the same as I've listed above, but is also polls the page for mouseup, then checks for selected text and displays a menu for a short period of time. If you'd like to look at the code and pick out parts to use, the source is available at http://code.google.com/p/select-actions/source/browse/select_actions.js
I apologize if it's messy, I only worked on it for about a day and I keep meaning to go back to it, but Chrome will offer extensions hooks into the context menu very soon, so it seems pointless to change anything until then.
edit: regarding the modal dialog aspect, that's done with CSS. Code for that is available here: http://raven-seo-tools.com/blog/2911/create-a-modal-dialog-using-css-and-javascript