Left-click anywhere on the web page and a pop-up will pop up. In fact, JS is used to control the display of the DIV layer. There is a table nested in the DIV layer, and a menu is placed in the table. This way, it is easy to modify and does not require CSS. It doesn’t matter, you can copy it, open it with DW and re-modify the menu style to your favorite color
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>隐藏菜单</title> <style type="text/css"> body { font: 9pt; } .box { font: 9pt "宋体"; position: absolute; background: skyblue; } </style> </head> <body> <table cellpadding="5" id="itemopen" class="box" style="display:none"> <tr> <td bgcolor="#0066cc">网站导航:</td> </tr> <tr> <td><a href="/">AJAX实例</a></td> </tr> <tr> <td><a href="/jscss/">jQuery相关</a></td> </tr> <tr> <td><a href="/jscss/">ExtJS演示</a></td> </tr> </table> </center> </div> <script language="JavaScript"> document.onclick = popUp function popUp() { newX = window.event.x + document.body.scrollLeft newY = window.event.y + document.body.scrollTop menu = document.all.itemopen if ( menu.style.display == ""){ menu.style.display = "none" } else { menu.style.display = ""} menu.style.pixelLeft = newX - 50 menu.style.pixelTop = newY - 50 } </script> <body> <p align="center"><font size="3">点击左键看看?</p> </body> </html>
I hope this article will be helpful to everyone’s JavaScript programming design.