Meta Test

by bman654

HTML

<div id="target">
    Click here with no keys held down<br/>
    Then again with COMMAND key held down<br/>
    Then do it again with CTRL key held down<br/>
    Then, if you have a 2-button mouse, repeat the process with the other button
</div>

<pre id="out"></pre>

CSS

#target {
    border: 1px solid black;
    margin: 10px;
    cursor: pointer;
}

#out {
    margin-top: 30px;
    background-color: #ccc;
    border: 1px solid black;
}

JavaScript

var agent = navigator.userAgent,
    msg = agent + "\n",
    $out = $("#out");

$out.text(msg);

$("#target").on("mousedown", function (ev) {
    msg += "click: " + ev.button + " " + ev.originalEvent.button + " " + ev.ctrlKey + " " + ev.originalEvent.ctrlKey + " " + ev.metaKey + " " + ev.originalEvent.metaKey + "\n";
    $out.text(msg);
}).on("contextmenu", function (ev) {
    msg += "--contextmenu--\n";
    $out.text(msg);
});