首页 > 代码库 > js简单菜单

js简单菜单

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="http://www.mamicode.com/">
   
    <title>My JSP ‘menu.jsp‘ starting page</title>
   
 <meta http-equiv="pragma" content="no-cache">
 <meta http-equiv="cache-control" content="no-cache">
 <meta http-equiv="expires" content="0">   
 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
 <meta http-equiv="description" content="This is my page">
 <!--
 <link rel="stylesheet" type="text/css" href="http://www.mamicode.com/styles.css">
 -->
 <style>
 a{
  text-decoration: none;
 }
 div{
  position: absolute;
  z-index: auto;
 }
 
 </style>
 
 <script>
 function $(id)
 {
  return document.getElementById(id);
 }
 function show(id)
 {
  if($(id).style.display==‘none‘)
  {
   $(id).style.display=‘‘;
   return;
  }
  if($(id).style.display==‘‘)
  {
   $(id).style.display=‘none‘;
   return;
  }
 }
</script>

  </head>
 
  <body>
    <table border="1" cellpadding="1" cellspacing="1" width="300px" align="center" bgcolor="red">
    <tr>
    <td onm ouseover="show(‘t1‘)" onm ouseout="show(‘t1‘)">手机数码<br>
    <div style="display:‘none‘" id="t1">
     <a href="http://www.mamicode.com/success.jsp">手机数码1</a><br>
     <a href="http://www.mamicode.com/#">手机数码2</a><br>
     <a href="http://www.mamicode.com/#">手机数码3</a><br>
     </div>
    </td>
    
    <td onm ouseover="show(‘t2‘)" onm ouseout="show(‘t2‘)">淘宝集市<br>
    <div style="display:‘none‘" id="t2">
     <a href="http://www.mamicode.com/#">淘宝集市1</a><br>
     <a href="http://www.mamicode.com/#">淘宝集市2</a><br>
     <a href="http://www.mamicode.com/#">淘宝集市3</a><br>
     </div>
    </td>
   
    <td onm ouseover="show(‘t3‘)" onm ouseout="show(‘t3‘)">品牌商城<br>
    <div style="display:‘none‘" id="t3">
     <a href="http://www.mamicode.com/#">品牌商城1</a><br>
     <a href="http://www.mamicode.com/#">品牌商城2</a><br>
     <a href="http://www.mamicode.com/#">品牌商城3</a><br>
     </div>
    </td>
    </tr>
   
   </table>
  </body>
</html>