javascript 仿FLASH效果的竖向导航菜单-jQuery中文网

javascript 仿FLASH效果的竖向导航菜单

2017-09-30 00:00:00 发布 250 浏览

页面报错/反馈

已收藏点赞

提示：您可以先修改部分代码再运行

javascript 仿FLASH效果的竖向导航菜单        <title>javascript 仿FLASH效果的竖向导航菜单</title>  <meta http-equiv="content-type" content="text/html;charset=gb2312">  与之间-->  <style type="text/css">  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>      与之间-->  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>G1      <p>good morning</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>G2      <p>good evening</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>M1      <p>my name is fireyy</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>M2      <p>mm mm i love u</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>G1      <p>good morning</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>G2      <p>good evening</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>M1      <p>my name is fireyy</p>    </div>  </div>  <p id="fbtn">    </p><div id="fbtn_mask">    <p id="fbtn_txt">      </p><div>M2      <p>mm mm i love u</p>    </div>  </div>  <script language="javascript">  var current=null;  var t=null;  for(var i=0;i<fbtn.length;i  ){  fbtn_txt[i].style.posTop=-30;  fbtn_mask[i].style.posTop=-30;  fbtn[i].index=i;  fbtn[i].style.display="block";  fbtn[i].onmouseover=function(){  if(!current){  current=this;  domove(this.index);  }  else   if(current!=this){  domove(current.index);  domove(this.index);  current=this;  }  }  fbtn[i].onmouseout=function(){  if(event.toElement==this.parentElement&t==this){  domove(this.index);  current=null;  }  }  }  function domove(num){  var o=fbtn_txt[num];  var m=fbtn_mask[num];  if(o.style.posTop<-60){  o.style.display="none";  var t=o.children[1].innerHTML;  o.children[1].innerHTML=o.children[0].innerHTML;  o.children[0].innerHTML=t;  o.style.posTop=-30;  o.style.display="block";  if(m.style.posTop>30)  m.style.posTop=-30;  else  m.style.posTop=0;  }  else{  m.style.posTop =3;  o.style.posTop-=3;  setTimeout('domove(' num ')',15);  }  }  </script>

登录查看全部

参与评论

javascript 仿FLASH效果的竖向导航菜单

参与评论

评论留言

还没有评论留言，赶紧来抢楼吧~~

给这篇文章打个标签吧~