Положение фрейма в JavaScript

StackOverflow https://stackoverflow.com/questions/397320

Вопрос

У меня есть веб-страница на основе фреймов с 3 фреймами.Верхний слой, навигация с левой стороны и рамка содержимого с нижней правой стороны.

Теперь я хочу отобразить всплывающее меню, когда пользователь щелкает правой кнопкой мыши по контенту-фрейму.Поскольку div-контейнер не может выйти за пределы фрейма, моя идея заключалась в том, чтобы поместить всю фреймовую страницу в новый iframe.На этой странице у меня мог бы быть второй iframe, который является моим всплывающим меню.

Итак, теперь у меня есть этот макет:

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

В моем контентном фрейме у меня происходит событие "onmouseover", назначенное тегу body.Это событие должно открыть всплывающий iframe в текущем положении мыши.И именно в этом заключается моя проблема:Как получить координаты мыши относительно верхнего веб-сайта (стартовая страница в моем проекте)?

В настоящее время у меня есть эта функция наведения курсора мыши (прямо сейчас работает только в IE, но заставить ее работать в FF & Co не должно быть проблемой ...)

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;
  }    
}

Как вы можете видеть, переменные "event.ScreenX" и "screenY" - это не те переменные, которые я могу использовать, потому что они не относятся к главной странице.

Есть какие-нибудь идеи?

Это было полезно?

Решение

Если вы планируете поддерживать только IE - вы можете попробовать использовать новое модальное окно, вызвав window.showModalDialog.Вы можете расположить новое окно в любом месте экрана.

Есть много недостатков в использовании нового окна в целом, причем модального...

Кстати - FF 3 и выше также поддерживает window.showModalDialog

Другие советы

Вы говорите, что это корпоративное приложение - обязательно ли вам поддерживать все основные браузеры, или достаточно IE?

Я спрашиваю об этом, потому что в IE есть функция, которая работает именно так, как вам нужно:

window.createPopup(...)

http://msdn.microsoft.com/en-us/library/ms536392 (ПРОТИВ 85).aspx

Всплывающее окно будет видно даже за пределами окна браузера!:-)

Чтобы показать это, используйте метод .show(...), который принимает аргументы position и size (подробности см. в MSDN).Приятно то, что вы также можете передать ссылку на элемент страницы, относительно которого задана позиция, так что вы можете легко расположить всплывающее окно относительно определенного элемента страницы, определенного фрейма, определенного окна браузера или даже относительно рабочего стола.

Я бы настоятельно рекомендовал переключить ваш набор фреймов на стандартный макет DIV с использованием css.Вот хорошая отправная точка для настройки множество различных CSS-макетов.

Я знаю, это может быть не то, что вы хотите услышать, но фреймы имеют много недостатков, помимо проблемы со всплывающим меню, с которой вы сейчас сталкиваетесь.Например:

  • Рамки сложно или невозможно правильно добавлять в закладки, поскольку набор рамок обычно является единственной страницей, которая видна в адресе.
  • Очень легко выйти из набора фреймов, загрузив ссылку в новом окне браузера.Это означает, что пользователь может потерять навигацию или заблудиться.
  • Они не работают изящно на мобильных устройствах и в текстовых браузерах.Большим плюсом css-макетов является то, что даже без каких-либо включенных стилей они все еще пригодны для использования.
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top