http://www.blueidea.com/download/product/2008/5578.asp
源代码：
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;
}
}
使用方法：
1.把以上代码引进你的页面
<script type="text/javascript" src="scrollDoor.js"></script>
2.在页面的"<body>"标签前加入以下代码:
<script type="text/javascript">
var SDmodel = new scrollDoor();
SDmodel.sd([菜单id数组],[显示层id数组],"菜单触发类","菜单关闭类");
SDmodel.sd([菜单id数组2],[显示层id数组2],"菜单触发类","菜单关闭类");
SDmodel.sd([菜单id数组3],[显示层id数组3],"菜单触发类","菜单关闭类");
</script>
其中sd方法中的参数为：
- 参数一 [菜单id数组]：滑动门菜单的id
- 参数二 [内容id数组]：显示和隐藏滑动内容层的id
- 参数三 "菜单触发类"：鼠标经过滑动门菜单的类
- 参数四 "菜单关闭类"：鼠标滑出滑动门菜单的类
3.页面中有几个滑动门就调用几次sd函数,只需改变sd调用的参数,如以上代码上所展示.
分享到：
- 2008-04-05 12:18
- 浏览 1425
- 评论(0)
- 论坛回复 / 浏览 (0 / 1024)
- 查看更多
相关推荐
在页面的""标签前加入以下代码: 其中sd方法中的参数为： 参数一 [菜单id数组]：滑动门菜单的id 参数二 [内容id数组]：显示和隐藏滑动内容层的id 参数三 "菜单触发类"：鼠标经过滑动门菜单的类 参数四 "菜单关闭类"：...
这种效果可以通过JavaScript实现，本篇将介绍一个名为“js通用滑动门类”的代码实现。 首先，我们需要理解滑动门类的基本结构。这个类可能包含以下几个核心部分： 1. **DOM操作**：滑动门类需要能够找到指定的菜单...
通用滑动门类! 很值得下载看看!资源免费,大家分享!!
在页面的标签前加入以下代码: 其中sd方法中的参数为： 参数一 [菜单id数组]：滑动门菜单的id 参数二 [内容id数组]：显示和隐藏滑动内容层的id 参数三 菜单触发类：鼠标经过滑动门菜单的类 参数四 菜单关闭类：
- **通用滑动门类.htm**：这可能是实现一个通用滑动门菜单的HTML模板，可以适用于各种场景，可能包含了一个可复用的JavaScript类。 - **滑动门TAB导航菜单**：这可能是一个完整的滑动门菜单实现，包括HTML、CSS和...
原生JS编写的滑动门效果 重用性高，精简代码 重用通用滑动门脚本原生js 兼容多平台
滑动门(js封装类,javascript,选项卡,滑动门,tag) 通用滑动门
在这个场景下，我们讨论的是一个用JavaScript编写的通用滑动门类，它可以被封装以便在不同的项目中重复使用。 首先，让我们理解滑动门效果的基本原理。滑动门通常由两部分组成：上部分（顶部边框）和下部分（内容...
"js蓝色通用滑动导航菜单显示下拉菜单效果"是一个专为网页开发设计的JavaScript功能，旨在提供美观且用户友好的导航体验。这个功能通常会用在各种类型的网站上，因为它的通用性和蓝色主题使其能够适应不同的网页设计...
发布一款封装的通用滑动门（青蛙实战） 发布一款封装的通用滑动门（青蛙实战）
标题中的“通用滑动删除”指的是在移动应用开发中常用的一种交互设计，允许用户通过手势滑动列表项来触发删除操作。这种设计常见于各种列表和网格视图中，提高了用户体验，使得数据管理更加直观便捷。 描述中的“该...
兼容大部分浏览器的滑动门代码，适用于各主流浏览器。
滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单滑动菜单...
在"swiper滑动-上下左右滑动结合"的项目中，开发者通过Swiper实现了一个复杂的交互效果，既支持水平滑动，也支持垂直滑动，并且可以在左右滑动的过程中嵌入上下滑动的内容。这样的设计极大地丰富了用户的浏览体验，...
在Android开发中，滑动操作是用户界面设计中常见的交互方式，尤其在移动设备上，滑动解锁功能更是被广泛采用。"滑动解锁"这一概念最初源于早期智能手机的解锁方式，用户通过在屏幕上沿特定路径滑动手指来解锁设备。...
滑动按钮（Slide Toggle）和滑动复选框（Slide Checkbox）是移动应用设计中常见的一种交互元素，尤其在Android和iOS平台上广泛使用。这两种组件为用户提供了一种直观且节省空间的方式来切换选项或状态，通常用于开启...
在Android开发中，创建一个能够实现纵向滑动，即上下滑动效果的页面是一项常见的任务。这样的效果常常用于实现如滚动列表、轮播图或阅读器等应用功能。本教程将详细讲解如何在Android中实现这样的功能，并结合提供的...
Android 仿抖音上下滑动布局详解 Android 仿抖音上下滑动布局是指在 Android 应用程序中实现类似抖音 App 的上下滑动布局效果，该效果可以实现上下滑动、监听播放、自动吸顶、吸底等功能。本文将详细介绍 Android ...
标题提到的“Android上下左右滑动支持同时滑动斜向任意方向滑动大图片浏览大图表浏览”是一个旨在提升用户体验的技术解决方案。这个功能允许用户在设备上更加流畅地查看大尺寸的内容，而不会受到单一滑动方向的限制...