Dart: onContextMenu position misplaced - dart

I have a problem with mouse right click menu. My web app has left navigation div, toolbar div, and contentView div. contentView div shows all of my contents /works kind of like web within web/. So here the problem begins. I created onContextMenu on my table like this:
tr.onContextMenu.listen((e) {
contextMenu.style.display = 'block';
contextMenu.style.left = "${e.page.x}px";
contextMenu.style.top = "${e.page.y}px";
selectedRow.clear();
selectedRow.add(tr);
});
When i click right button it takes the position from whole window but when it shows the context menu, the position is based on contentView div. For example if my mouse position is (200,200) it's like (wholepage.0+200,wholepage.0+300) and context menu position would be around (400,500) which is like (contentView div.0+200,contentView div.0+300).
So how can i show my context menu at where mouse is clicked?


Try
contextMenu.style.left = "${e.client.x}px";
contextMenu.style.top = "${e.client.y}px";
and dont forget absolute positioning.
Regards Robert


Well i just changed
${e.page.x}px;
${e.page.y}px;
to
${e.layer.x}px;
${e.layer.y}px;
and now it works.

Related

Openlayers 3 map initially only draws on window resize

I have a popup window that comes up when you click on a map marker. Within the popup window there is a minimap that shows the point that was clicked on, but zoomed in, so a thumbnail of that point on the ground. This minimap is an innerHTML element in the popup window. When I first click on the marker, this map element is blank, but when I resize my browser window the map appears. Also when I click on a different marker, the map will appear if I don't close the popup. The map just does not show up when the popup initially appears unless I resize the browser. Does anyone know what could be the issue? Thanks!

I've had this issue in the past - on window resizes. I tend to trigger a resize to force it when starting.
Try calling map.getMap().updateSize(); after you setup the map in the popup?

How to have a list of options when clicking a TButton on Firemonkey?

I know that TButton on firemonkey let me add a TPopUp Menu. But it only works when you right click it.
I need make it open right below the button when you do the normal click.
PopupMenu.PopUp(X, Y) is based on the form I believe. How to translate the X,Y of the button (that is deep inside other layouts) to the same coordinate?
And when clicking and the PopUp is shown some weird behavior happens with the selection bar of the popup menu that disappear. The button keeps pressed, that is good.

Look here:
http://blogs.embarcadero.com/sarinadupont/2013/10/17/463/
Is an example for mobile, but you use in desktop too.

jQuery mobile popup not appearing in center

I am using jQuery mobile and trying to show jQuery pop on page load. But when the page is loaded popup is not appearing in center, instead popup's TOP LEFT corner is appearing in center.
But as soon as browser window size gets change popup automatically shifts to center (Even if I press F12 for developers tool). And then all frequent calls to $('#popupBasic').popup("open"); make it to appear in center of the screen.
But first time top left corner of the popup box appearing in center.

try this: data-position-to="window".
this is the source

You may try repositioning the popup on pageshow:
$( '#popupLogin' ).popup( 'reposition', 'positionTo: window' );
I reckon what you are experiencing is down to the positioning happening prior the page is fully drawn by the browser. You can overcome this by repositioning the popup like this:
$(document).on('pageshow', '.selector', function(){
$('#popupBasic').popup('reposition', 'positionTo: window');
});

$(document).on("popupafteropen", function() {
$('#popup').popup('reposition', 'positionTo: window');
});
You can use the custom pop up events to reposition it after opening

I was getting the same error. You only want to show the popup after the page has been painted.
Adding your code to listen to the pageshow event instead of the pageinit event will probably fix your problem. It fixed it for me.

This is a very vague question.
A few items you should provide:
What browser are you testing on and what version?
What version of JQM?
Are there any custom CSS interacting with JQM?
As of JQM 1.2, Popup options available:
default: "origin"
Sets the element relative to which the popup will be centered. It has the following values:
"origin" When the popup opens, center over the coordinates passed to the open() call (see methods page).
"window" When the popup opens, center in the window.
jQuery selector When the popup opens, create a jQuery object based on the selector, and center over it. The selector is filtered for elements that are visible with ":visible". If the result is empty, the popup will be centered in the window.
Source

It worked for me when I set the width of popup div manually; try:
$("#popupBasic").css("width","200px");

how to get real size of elements in the tab panel when user selects tab

What I want to do is getting width and height of elements inside of the selected ui-tab-pane when user selects tab header.
But width and height are always zero because ui-tab-pane is still display:none even though user clicked tab header.
Is there any fancy way to get real size of ui-tab-pane?

I solved by myself.
Don't use 'tabsselect' event when you need to manipulate ui-tab-panel.
Use 'li a' click event as below
$('#tabs li a').click(function () {
// do something to manipulate ui-tab-panel
});

Animate only a part of an element

how can I animate only a part of an element?
I show/hide a div using jquery-ui's show method but I'd like to start/end the animation from/to a given height of the element.
My dev website can be seen here (link removed). When clicking on the 'Contact' button the contact page shows up or hides if it's already open. Since I couldn't find how to starts my animation from a given height I added a fixed button when it's closed, but when the contact button of the contact page overlaps the fixed button when it's closing...
Any help welcome!

looking for something like this??
http://jsfiddle.net/rlemon/F6Efp/8/
You can also add any fade or whatever effects. This is using a single button to animate both open and close. You could also attach a attribute to the button tag to define it's current state.

Resources