工作台收缩展开说明书
0.00
★16次@未来之窗
A:赛忞初雪
工作台收缩展开说明书
本元素折叠/展开模块为工作台提供了强大的收缩与展开功能,支持向上、向下、向左、向右四个方向的操作。通过该模块,用户可以方便地控制工作台特定区域的显示与隐藏,有效节省页面空间,提升操作的便捷性和灵活性。
该模块依赖 cyberwin_query 核心框架,若该框架未初始化,模块将无法正常工作,并会在控制台输出错误信息。
$cq.工作台收缩此函数用于实现元素的折叠与展开切换功能。
| 参数 | 类型 | 是否必选 | 说明 |
|---|---|---|---|
containerSelector |
字符串或 HTMLElement |
是 | 容器的选择器或元素本身,作为折叠展开操作的整体容器。 |
headerSelector |
字符串或 HTMLElement |
是 | 触发折叠展开操作的头部元素的选择器或元素本身。 |
contentSelector |
字符串或 HTMLElement |
是 | 要进行折叠展开的内容元素的选择器或元素本身。 |
direction |
字符串 | 否 | 折叠展开的方向,可选值为 'up'(向上)、'down'(向下)、'left'(向左)、'right'(向右),默认值为 'up'。 |
返回值:返回 实例,支持链式调用。
$cq.fairyalliance_toggleCollapse这是一个静态方法,功能与 $cq.工作台收缩 相同,可直接通过 调用。
参数说明:与 $cq.工作台收缩 的参数一致。
返回值:返回 实例,支持链式调用。
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>工作台收缩 Demo</title>
</head>
<body>
<div id="workbench-container">
<div id="workbench-header">工作台内容(点击向上展开)</div>
<div id="workbench-content">
<p>这里是工作台的详细内容,包含各种操作信息和数据展示。</p>
</div>
</div>
<script>
// 调用折叠展开函数
$cq.工作台收缩('#workbench-container', '#workbench-header', '#workbench-content', 'up');
</script>
</body>
</html>
硬件app