Как стать автором
Обновить

jQuery и плагин ContextMenu — правый клик в Opera

Время на прочтение3 мин
Количество просмотров1.3K
Недавно передо мной встала задача — реализовать в админке одного проекта контекстное меню по правому клику мыши. Для решения этой задачи нашел плагин для jQuery — contextMenu, демонстрация. Посмотрел пример, скачал, прикрутил и начал проверять. IE — нормально, FF — нормально, Safari — нормально, Opera — не работает!

И так, проблема:
Opera не позволяет создавать свое контекстное меню и отслеживать правый клик мыши.

Решение:
Как Вы знаете (или не знаете) в Опере есть настройки JavaScript (Инструменты — Настройки — Дополнительно — Содержимое — Настройки JavaScript), там есть свойство «Позволить контролировать правую кнопку мыши». Щелкнув на нее имеем результат — JS отлавливает событие правого клика и показывает контекстное меню, но поверх него выпадает стандартное меню. Немного погуглившись нашел решение своей проблемы:

  1.     // Проверяем браузер, и если это Опера выполняем скрипт
  2.     if(navigator.appName.indexOf("Opera")!=-1){
  3.       // Инициализация скрипта
  4.       (function(){
  5.         // Скрываем контекстное меню, когда нажата кнопка мыши
  6.         addEventListener('mousedown',function(e){
  7.           // Если нажата правая кнопка мыши - меню не закрываем
  8.           if( e && e.button == 2 ){
  9.             cancelMenu(e);
  10.             return false;
  11.           }
  12.         },true);
  13.  
  14.         var overrideButton;
  15.         function cancelMenu(e){
  16.           if(!overrideButton){
  17.             var doc = e.target.ownerDocument;
  18.             overrideButton = doc.createElement('input');
  19.             overrideButton.type='button';
  20.             (doc.body||doc.documentElement).appendChild(overrideButton);
  21.           }
  22.           overrideButton.style='position:absolute;top:'+(e.clientY-2)+'px;left:'+
  23.           (e.clientX-2)+'px;width:5px;height:5px;opacity:0.01';
  24.         }
  25.     
  26.       })( true, 1000 );
  27.     }
* This source code was highlighted with Source Code Highlighter.


Скрипт создает на странице кнопку, которая скрывает стандартное контекстно меню Оперы. Прикрутив этот скрипт к админке, получил следующее (смотреть в Опере). Теперь радуюсь и пользуюсь.

P.S. Во избежание лишних вопросов, скрипт используется только в админке и по этому посчиталось не страшным просить пользователя разрешить отслеживание клика правой кнопки мыши.

Теги:
Хабы:
+21
Комментарии22

Публикации