Confirmed users
133
edits
Luke-chang (talk | contribs) mNo edit summary |
Luke-chang (talk | contribs) m (→Concept) |
||
| Line 6: | Line 6: | ||
== Concept == | == Concept == | ||
<pre> | |||
<!DOCTYPE html> | |||
<html> | |||
<head> | |||
<style> | |||
html, body { | |||
height: 100%; | |||
margin: 0; | |||
} | |||
#div1, #div2 { | |||
float: left; | |||
margin: 10px; | |||
padding: 10px; | |||
background-color: aqua; | |||
} | |||
</style> | |||
<script> | |||
window.addEventListener('load', function() { | |||
function menu_handler(evt) { | |||
console.log(this.dataset.menuid); | |||
} | |||
var menuitems = document.getElementsByTagName('menuitem'); | |||
Array.from(menuitems).forEach(function(menuitem) { | |||
menuitem.addEventListener('click', menu_handler); | |||
}); | |||
}); | |||
</script> | |||
</head> | |||
<body contextmenu="menu1"> | |||
<div id="div1">Div 1</div> | |||
<div id="div2" contextmenu="menu2">Div 2</div> | |||
<menu type="context" id="menu1"> | |||
<menuitem data-menuid="lsk" label="LSK" icon="icon_lsk.png"></menuitem> | |||
<menuitem data-menuid="rsk" label="RSK" icon="icon_rsk.png"></menuitem> | |||
</menu> | |||
<menu type="context" id="menu2"> | |||
<menuitem data-menuid="lsk" label="LSK" icon="icon_lsk.png"></menuitem> | |||
<menuitem data-menuid="div_rsk_1" label="Div RSK item 1"></menuitem> | |||
<menuitem data-menuid="div_rsk_2" label="Div RSK item 2"></menuitem> | |||
<menuitem data-menuid="div_rsk_3" label="Div RSK item 3"></menuitem> | |||
</menu> | |||
</body> | |||
</html> | |||
</pre> | |||
== Proposed API == | == Proposed API == | ||