contextmenu.html revision fbef28ede3e6228a61a039aefbe9a4585515766c
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>contextmenu synthetic event</title>
<meta name="author" content="Todd Kloots">
#menu {
position: absolute;
display: none;
background: #ccc;
padding: 0;
margin: 0;
list-style-type: none;
}
</style>
<script type="text/javascript">
YUI({
filter: (window.location.search.match(/[?&]filter=([^&]+)/) || [])[1] || 'min',
allowRollup: false,
lazyEventFacade: true
}).use("event-contextmenu", "node-event-delegate", "node-style", "node-screen", "node-event-simulate", function (Y) {
var btn = Y.one("#btn-1");
var btn2 = Y.one("#btn-2");
function onContextmenu(e) {
var menu = Y.one("#menu");
menu.setStyle("display", "block");
}
btn.on("contextmenu", onContextmenu);
btn2.on("contextmenu", onContextmenu);
Y.one("doc").delegate("contextmenu", function (e) {
Y.log("First delegate() listener called");
}, "a");
Y.one("doc").delegate("contextmenu", function (e) {
Y.log("Second delegate() listener called");
}, "a");
btn.on("contextmenu", function (e) {
Y.log("First on() listener called");
});
btn.on("contextmenu", function (e) {
Y.log("Second on() listener called");
});
btn.on("contextmenu", function (e) {
Y.log("Third on() listener called");
});
});
</script>
</head>
<body>
<a href="#" id="btn-1">Button 1</a>
<button type="button" id="btn-2">Click Me</button>
<ul id="menu">
<li>Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
</ul>
</body>
</html>