CODEWITHSUNDEEP
javascriptpopupframemouse-position
Robert Wismet
Robert Wismet

Reputation: 67

Frame position in JavaScript

I am having a frame-based webpage with 3 frames. A topliner, a navigation on the left side and a content frame on the bottom right side.

Now, I want to show up a popup-menu when the user right-clicks on the content-frame. Because a div-container can not go out of the frame, my idea was, placing the whole frame-page into a new iframe. In that page I could have a second iframe which is my popup-menu.

So now, I am having this layout:

<html> (start-page)
  <iframe  (real content)
    <frameset 
      top-frame
      navigation-frame
      content-frame
    >
  >
  <iframe> (my popup-menu, positioned absolutelly and hidden by default)
</html>

In my content-frame I am having a "onmouseover"-event assigned to the body-tag. This event should open the popup-iframe at the current mouse-position. And exactly here is my problem: How to get the mouse-coordinates relativelly to the top-website (start-page in my draft)?

Currently I am having this mouseDown-function (works in IE only, right now - but getting it working in FF & Co shouldn't be the problem...)

function mouseDown(e)
{
  if (window.event.button === 2 || window.event.which === 3) 
  {
    top.popupFrame.style.left = event.screenX + "px";
    top.popupFrame.style.top = event.screenY + "px";
    top.popupFrame.style.display = "";
    return false;
  }    
}

As you can see, the "event.screenX" and "screenY" - variables are not that variables I can use, because they are not relative to the mainpage.

Any ideas?

Upvotes: 1

Views: 4025

Answers (3)

Dror
Dror

Reputation: 7303

If you are only planning to support IE - you can try using a new modal window by calling window.showModalDialog. You can position the new window anywhere on the screen.

There are many drawbacks to using a new window in general and a modal one at that...

By the way - FF 3 and up also supports window.showModalDialog

Upvotes: 1

qbeuek
qbeuek

Reputation: 4206

You say it's an enterprise application - do you have to support all major browser, or is IE enough?

I'm asking this because IE has a function that works exactly like you need:

window.createPopup(...)

http://msdn.microsoft.com/en-us/library/ms536392(VS.85).aspx

The pop-up will be visible even outside the browser window! :-)

To show it, use the .show(...) method which accepts position and size arguments (refer to MSDN for details). The nice thing is, you can also pass a reference to a page element relative to which the position is relative to, so you can easily position the popup relative to a certain page element, certain frame, certain browser window or even relatively to the desktop.

Upvotes: 1

Soviut
Soviut

Reputation: 91545

I would strongly recommend switching your frameset to a standard DIV layout using css. Here is a good starting point for setting up lots of different css layouts.

I know this may not be what you want to hear, but frames have a lot of drawbacks besides the popup menu problem you're currently facing. For instance:

  • Frames are difficult or impossible to bookmark correctly since the frameset is usually the only page that is visible in the address.
  • Its very easy to break out of a frameset by loading a link in a new browser window. This means that a user could lose their navigation or get lost.
  • They don't degrade gracefully on mobile devices and text-only browsers. A big plus for css layouts is that even without any styles turned on, they're still usable.

Upvotes: 0

Related Questions