2

Мне нужно как на http://www.ucoz.ru/ сделать так чтобы при клике правой кнопкой на обьект не выводился список браузера а исполнялась моя функция как это осущесвить желательно кросбраузерно?!

4 ответа 4

6

Посмотреть пример

$('selector').mousedown(function(event){
    event.preventDefault();
    if(event.button == 0){
        alert('Вы кликнули левой клавишей');
    } else if(event.button == 1){
        alert('Вы кликнули левой колесиком');
    } else if(event.button == 2){
        alert('Вы кликнули правой клавишей');
    }
});

Т.е. по стандартам W3C : 0 – левая клавиша, 1 – средняя, 2 – правая. Но тут есть и засада, насколько помню. Осел видит: 1 – левая, 2 – правая, 4 – средняя. Надо будет проверить.

1
  • А запретить вывод меню как незнаете? на ucoz во всех кроме Opera меню типа исходный код своства во весь экран непоявляется
    – Rules
    3 мар 2012 в 13:30
3

Пример здесь -->

Пример html:

<div class="context-menu">
    <div class="context" oncontextmenu="return menu(event);">
        <p>Click here with the right mouse button.</p>
    </div>
    <div class="right-menu">
        <!-- меню здесь -->
    </div>
</div>

jQuery:

var $j = jQuery.noConflict();

// Функция для определения координат указателя мыши
function defPosition(event) {
    var x = y = 0;
    var d = document;
    var w = window;

    if (d.attachEvent != null) { // Internet Explorer & Opera
        x = w.event.clientX + (d.documentElement.scrollLeft ? d.documentElement.scrollLeft : d.body.scrollLeft);
        y = w.event.clientY + (d.documentElement.scrollTop ? d.documentElement.scrollTop : d.body.scrollTop);
    } else if (!d.attachEvent && d.addEventListener) { // Gecko
        x = event.clientX + w.scrollX;
        y = event.clientY + w.scrollY;
    }

    return {x:x, y:y};
}

function menu(event) {
    // Блокируем всплывание события contextmenu
    event = event || window.event;
    event.cancelBubble = true;

    // Задаём позицию контекстному меню
    var menu = $j('.right-menu').css({
        top: defPosition(event).y + "px",
        left: defPosition(event).x + "px"
    });

    // Показываем собственное контекстное меню
    menu.show();

    // Блокируем всплывание стандартного браузерного меню
    return false;
}

// Закрываем контекстное при клике правой кнопкой по документу
$j(document).on('contextmenu', function(){
    $j('.right-menu').hide();
});

// Закрываем контекстное при клике левой кнопкой по документу
$j(document).on('click', function(){
    $j('.right-menu').hide();
});
0

Example for React - onContextMenu element:

onHandleRightClick = (event) => {
    console.log("CustomInfo -> event", event)
}

return (
     <div onContextMenu={onHandleRightClick}>
         Click My Right Button
     </div>
)
-1

Вот, смотрите:

window.oncontextmenu = (function(e){
    //действия
    return false;
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.