js通用滑动门类

网络编程 2025/9/24 佚名

3 2 1

明霞山资源网 Design By www.htccd.com

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>滑动门通用JS</title> <style type="text/css">  </style>  </head> <body>      <h1 class="t_rt">         滑动门封装类     </h1>          <h2>         效果预览     </h2>                                <ul class="scrollUl">                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>             </ul>                                                   第一层内容                                                       第二层内容                                                       第三层内容                                                       第四层内容                                                       第五层内容                                                                            <ul class="scrollUl">                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>             </ul>                                                   第一层内容                                                       第二层内容                                                       第三层内容                                                       第四层内容                                                       第五层内容                                                                            <ul class="scrollUl">                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>                 <li>滑动门</li>             </ul>                                                   第一层内容                                                       第二层内容                                                       第三层内容                                                       第四层内容                                                       第五层内容                                                      <h2>         源代码     </h2>                   <textarea id="sourse"> function scrollDoor(){ } scrollDoor.prototype = { sd : function(menus,divs,openClass,closeClass){     var _this = this;     if(menus.length != divs.length)     {         alert("菜单层数量和内容层数量不一样!");         return false;     }                     for(var i = 0 ; i < menus.length ; i++)     {             _this.$(menus[i]).value = i;                         _this.$(menus[i]).onmouseover = function(){                                  for(var j = 0 ; j < menus.length ; j++)             {                                         _this.$(menus[j]).className = closeClass;                 _this.$(divs[j]).style.display = "none";             }             _this.$(menus[this.value]).className = openClass;                 _this.$(divs[this.value]).style.display = "block";                         }     }  }, $ : function(oid){     if(typeof(oid) == "string")     return document.getElementById(oid);     return oid; } }         <"preview">         1.把以上代码引进你的页面 &lt;script type="text/javascript" src="/UploadFiles/2021-04-02/scrollDoor.js"> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

js,通用,滑动门类

标签：

js,通用,滑动门类

明霞山资源网 Design By www.htccd.com

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

明霞山资源网 Design By www.htccd.com

评论“js通用滑动门类”

暂无评论...

js通用滑动门类

js,通用,滑动门类

js动画效果打开层关闭层

js实现双击单元格变成文本输入框效果代码

评论“js通用滑动门类”

友情链接

js通用滑动门类

js,通用,滑动门类

js动画效果打开层 关闭层

js实现双击单元格变成文本输入框效果代码

评论“js通用滑动门类”

友情链接

js动画效果打开层关闭层