0顶

滑动门通用代码类

稿源：互联网 2022-04-27 16:38:13 点击： 3626 撤稿纠错

滑动门通用代码，非常漂亮并且实用的特效。

以下讨论的是和通用代码滑动门相关的滑动门通用代码类教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br><html xmlns="http://www.w3.org/1999/xhtml"><br><head><br><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><br><title>滑动门通用JS</title><br><style type="text/css"><br><br></style><br><script type="text/javascript"><br>/*<br>十三妖<br>qq:181907667<br>msn:wl181907667@hotmail.com<br>邮箱:thirdteendevil@163.com<br>*/<br>function scrollDoor(){<br>}<br>scrollDoor.prototype = {<br> sd : function(menus,divs,openClass,closeClass){<br>  var _this = this;<br>  if(menus.length != divs.length)<br>  {<br>   alert("菜单层数量和内容层数量不一样!");<br>   return false;<br>  }    <br>  for(var i = 0 ; i < menus.length ; i++)<br>  { <br>   _this.$(menus[i]).value = i;    <br>   _this.$(menus[i]).onmouseover = function(){<br>     <br>    for(var j = 0 ; j < menus.length ; j++)<br>    {      <br>     _this.$(menus[j]).className = closeClass;<br>     _this.$(divs[j]).style.display = "none";<br>    }<br>    _this.$(menus[this.value]).className = openClass; <br>    _this.$(divs[this.value]).style.display = "block";    <br>   }<br>  }<br>  },<br> $ : function(oid){<br>  if(typeof(oid) == "string")<br>  return document.getElementById(oid);<br>  return oid;<br> }<br>}<br>window.onload = function(){<br> var SDmodel = new scrollDoor();<br> SDmodel.sd(["m01","m02","m03","m04","m05"],["c01","c02","c03","c04","c05"],"sd01","sd02");<br> SDmodel.sd(["mm01","mm02","mm03","mm04","mm05"],["cc01","cc02","cc03","cc04","cc05"],"sd01","sd02");<br> SDmodel.sd(["mmm01","mmm02","mmm03","mmm04","mmm05"],["ccc01","ccc02","ccc03","ccc04","ccc05"],"sd01","sd02");<br>}<br></script><br></head><br><body><br><div class="bodyer"><br> <h1 class="t_rt"><br>  滑动门封装类<br> </h1><br> <br> <h2><br>  效果预览<br> </h2><br> <br> <div class="preview"><br>  <div class="scrolldoorFrame"><br>   <ul class="scrollUl"><br>    <li class="sd01" id="m01">滑动门</li><br>    <li class="sd02" id="m02">滑动门</li><br>    <li class="sd02" id="m03">滑动门</li><br>    <li class="sd02" id="m04">滑动门</li><br>    <li class="sd02" id="m05">滑动门</li><br>   </ul><br>   <div class="bor03 cont"><br>    <div id="c01"><br>     第一层内容<br>    </div><br>    <div id="c02" class="hidden"><br>     第二层内容<br>    </div><br>    <div id="c03" class="hidden"><br>     第三层内容<br>    </div><br>    <div id="c04" class="hidden"><br>     第四层内容<br>    </div><br>    <div id="c05" class="hidden"><br>     第五层内容<br>    </div><br>   </div><br>  </div><br> </div><br> <br> <div class="preview"><br>  <div class="scrolldoorFrame"><br>   <ul class="scrollUl"><br>    <li class="sd01" id="mm01">滑动门</li><br>    <li class="sd02" id="mm02">滑动门</li><br>    <li class="sd02" id="mm03">滑动门</li><br>    <li class="sd02" id="mm04">滑动门</li><br>    <li class="sd02" id="mm05">滑动门</li><br>   </ul><br>   <div class="bor03 cont"><br>    <div id="cc01"><br>     第一层内容<br>    </div><br>    <div id="cc02" class="hidden"><br>     第二层内容<br>    </div><br>    <div id="cc03" class="hidden"><br>     第三层内容<br>    </div><br>    <div id="cc04" class="hidden"><br>     第四层内容<br>    </div><br>    <div id="cc05" class="hidden"><br>     第五层内容<br>    </div><br>   </div><br>  </div><br> </div><br> <br> <div class="preview"><br>  <div class="scrolldoorFrame"><br>   <ul class="scrollUl"><br>    <li class="sd01" id="mmm01">滑动门</li><br>    <li class="sd02" id="mmm02">滑动门</li><br>    <li class="sd02" id="mmm03">滑动门</li><br>    <li class="sd02" id="mmm04">滑动门</li><br>    <li class="sd02" id="mmm05">滑动门</li><br>   </ul><br>   <div class="bor03 cont"><br>    <div id="ccc01"><br>     第一层内容<br>    </div><br>    <div id="ccc02" class="hidden"><br>     第二层内容<br>    </div><br>    <div id="ccc03" class="hidden"><br>     第三层内容<br>    </div><br>    <div id="ccc04" class="hidden"><br>     第四层内容<br>    </div><br>    <div id="ccc05" class="hidden"><br>     第五层内容<br>    </div><br>   </div><br>  </div><br> </div><br> <br></div><br></body><br></html></font><br><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于滑动门通用代码类的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200805311225.shtml方便下次再访问哦。

·上一篇： 鼠标点击展开关闭层效果
·下一篇： 用图片代替滚动条特效

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

滑动门通用代码类

文章分类LIST >>返回首页

最新游戏

最新新闻