Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
120
Popup Menu Does not Appear to Take into Account Margins
posted

Hi,

We're using the 2008.1 release and have run into a problem where the positioning of the Popup Menu, when attached to the a Tree View, is incorrect. With a bit of analysis we can see that in Internet Explorer, the issue is due to the fact that the position is not taking into account the top and left margins of the page - we have a fixed margin of 10px at the top of the page and are using 'Margin: 0px auto 0px auto' to achieve centering. There are also problems in Firefox, but at the moment we have not understood the cause, however the positioning is more significantly incorrect and every time the popup menu is displayed by right clicking on the tree node it's width increases by a number of pixels.

Has anyone else experienced this issue? Is there something that we should be doing, but have missed?

For reference, we use the javascript below in other solutions to position popup help panels, etc for a given element successfully in both Firefox and Internet Explorer.

function FindElementsPosition(element) {

  var curLeft = 0;
  var curTop = 0;

 if (element.offsetParent) {

  curLeft = element.offsetLeft
  curTop = element.offsetTop

  while (element = element.offsetParent) {
   curLeft += element.offsetLeft
   curTop += element.offsetTop
  }

 }

 return [curLeft,curTop];

}

 

Thanks in advance....

Cheers, James.

Parents
  • 28464
    posted

    Hello James, 

    Positioning in browsers is a very tricky topic, and there are various problems to deal with. The FindElementsPosition function you are using is a variation of the classic FindPos function first introduced by the Quirksmode web-site:

    http://www.quirksmode.org/js/findpos.html

    However, If you are already using ASP.NET 3.5 and/or ASP.NET AJAX, you can try using the not very popular, but very helpful client-side method getLocation to get the coordinates of the element clicked and place the menu there. Some information can be found here:

    http://weblogs.asp.net/bleroy/archive/2008/01/29/getting-absolute-coordinates-from-a-dom-element.aspx

    I am almost positive that the newly introduced function gives better results than the QuirksMode one. You can also take a look at the following blog post for comments/reflections and suggestions related to positioning and coordinates in browsers:

    http://www.jtulloch.com/blog/post/2008/02/Mouse-position---relative-to-a-containing-element.aspx

    Hope this helps. 

Reply Children