<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title> <style> *{ margin: 0; padding: 0; } #ul1{ width: 100px; height: auto; background: #eee; border: 1px solid black; position: absolute; left: 0; top: 0; display: none; } li{ list-style: none; } </style> <script> document.oncontextmenu=function(ev){ var oUl = document.getElementById('ul1'); var oEvent = ev||event; var scrollTop = document.documentElement.scrollTop||document.body.scrollTop; var scrollLeft = document.documentElement.scrollLeft||document.body.scrollLeft; oUl.style.display='block'; oUl.style.left=oEvent.clientX+scrollLeft+'px'; oUl.style.top=oEvent.clientY+scrollTop+'px'; return false; } document.onclick=function(){ var oUl = document.getElementById('ul1'); oUl.style.display='none'; } </script> </head> <body> <ul id="ul1"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> </body> </html>
结果如下图所示：
