SoFunction
Updated on 2025-04-03

JavaScript implements the method of clicking the left button to pop up a hidden menu at any web page

Click the left button anywhere on the web page and it will pop up. In fact, JS is used to control the display of the DIV layer. A table is nested in the DIV layer, and the menu is placed in the table. This makes it easy to modify. It doesn’t matter if you don’t know how to CSS. You can copy it, open it with DW and re-modify the menu style, and change it to your favorite color.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Hide menu</title>
<style type="text/css">
body {
 font: 9pt;
}
.box {
 font: 9pt "Songyi";
 position: absolute;
 background: skyblue;
}
</style>
</head>
<body>
<table cellpadding="5"  class="box" style="display:none">
 <tr>
  &lt;td bgcolor="#0066cc">Website navigation:</td> &lt;/tr&gt;
&lt;tr&gt;
  &lt;td&gt;&lt;a href="/"&gt;AJAXExample&lt;/a&gt;&lt;/td&gt;
 &lt;/tr&gt;
 &lt;tr&gt;
  &lt;td&gt;&lt;a href="/jscss/"&gt;jQueryRelated&lt;/a&gt;&lt;/td&gt;
 &lt;/tr&gt;
 &lt;tr&gt;
  &lt;td&gt;&lt;a href="/jscss/"&gt;ExtJSDemo&lt;/a&gt;&lt;/td&gt;
 &lt;/tr&gt;
&lt;/table&gt;
&lt;/center&gt;
&lt;/div&gt;
&lt;script language="JavaScript"&gt;
 = popUp 
function popUp() {
newX =  + 
newY =  + 
menu = 
 if (  == ""){
   = "none" }
 else {
    = ""}
   = newX - 50
   = newY - 50
}
&lt;/script&gt;
&lt;body&gt;
&lt;p align="center"&gt;&lt;font size="3"&gt;Click the left button to see？&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;

I hope this article will be helpful to everyone's JavaScript programming.