当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 一个简单的javascript菜单(1)

HTML/XHTML教程
使用Web标准建站第5天:head区的其他设置
使用Web标准建站第4天:调用样式表
使用Web标准建站第3天:定义语言编码
使用Web标准建站第2天:什么是名字空间
使用Web标准建站第1天:选择什么样的DOCTYPE
使用Web标准建站第12天:校验及常见错误
使用Web标准建站第11天:不用表格的菜单
使用Web标准建站第10天:自适应高度
实现网页渐入特殊效果
实现网页的动态过渡效果
让网页里的提交按钮变得更靓丽
让浏览者记住你的主页
批量消除超链接虚线框
精彩网页九“慎”
解析HTML的增强标记
简单实用的网页表格特效
几个对图形进行动态处理的dhtml代码
基于Web标准的UI组件 — 菜单(1)
关于iframe的透明背景
shtml网页SSI使用详解

HTML/XHTML教程 中的 一个简单的javascript菜单(1)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 48 ::
收藏到网摘: n/a


上图为代码执行成功后的结果





<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>AgetimeMenu Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
 .agetime_bar{
  position:absolute;top:0px;left:0px;height:22px;width:100%;border:1px outset;background-color:RGB(212,208,200);z-index:98;
 }
 .agetime_barItem{
  width:60px;height:20px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px;
  background:RGB(212,208,200);color:#000000;font-size:9pt;
 }
 .agetime_barItemDown{
  width:60px;height:20px;border:1px inset RGB(212,208,200);text-align:left;padding-left:10px;
  background:#F0F0F0;color:#000000;font-size:9pt;
 }
 .agetime_barItemHover{
  width:60px;height:20px;border:1 outset;text-align:left;padding-left:10px;
  background:#F0F0F0;color:#000000;font-size:9pt;
 }
 .agetime_pad{
  cursor:default;font-size:9pt;width:100%;
 }
 .agetime_padItem{
  width:100%;height:18px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px;
  background:RGB(212,208,200);color:#000000;font-size:9pt;
 }
 .agetime_padItemFalse{
  padding-left:10px;font-size:9pt; color:#808080;
 }
 .agetime_padItemFalseHover{
  padding-left:10px;font-size:9pt; color:#808080;background-color:#333366;
 }
 .agetime_padItemHover{
  width:100%;height:18px;text-align:left;padding-left:10px;
  background-color:#333366;color:#FFFFFF;font-size:9pt;
 }
 .agetime_padItemDown{
  width:100%;height:18px;text-align:left;padding-left:10px;border:1px inset;
  background-color:#9999CC;color:#FFFFFF;font-size:9pt;
 }
 .agetime_hr{
  border:1px inset;
 }
 .agetime_board{
  background-color:RGB(212,208,200);border:2px outset;
 }
</style>
</head>