基于Div+CSS+JS实现类Flash动态菜单效果

类Flash动态菜单实现方案

<html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  <title>css菜单</title>  <style>  body{  background-color:#B8B8A0;  }  #fbtn{  display:none;  overflow:hidden;  border-style:solid;  border-width:1px;  border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56;  padding:1 1 1 1;  width:115px;  height:30px;  }  #fbtn_txt{  position:relative;  }  #fbtn_txt div{  height:30px;  padding-top:11px;  font-size:12px;  color:#800080;  text-align:center;  cursor:hand;  }  #fbtn_mask{  background-color:#ffffff;  position:relative;  width:100%;  height:100%;  }  </style>  </head>  <body>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>G1</div>  <div>good morning</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>G2</div>  <div>good evening</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>M1</div>  <div>my name is fireyy</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>M2</div>  <div>mm mm i love u</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>G1</div>  <div>good morning</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>G2</div>  <div>good evening</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>M1</div>  <div>my name is fireyy</div>  </div>  </div>  <div id=fbtn>  <div id=fbtn_mask></div>  <div id=fbtn_txt>  <div>M2</div>  <div>mm mm i love u</div>  </div>  </div>    </body>  </html>

注意：若代码中引入了外部JavaScript文件，必须刷新页面后方可执行相关效果。