尧图网络 高端网站定制 · 原创设计
免费咨询热线
400-888-6620
免费获取方案
轻量级 jQuery 折叠插件 jQuery-Collapse:3 分钟读懂内容渐进式披露的终极方案
【免费下载链接】jQuery-CollapseA lightweight (~1kb) jQuery plugin that enables expanding and collapsing content项目地址https://gitcode.com/gh_mirrors/jq/jQuery-Collapse点击查看免费下载网页内容太多时直接全部展示会让用户感到 overwhelmed信息过载。jQuery-Collapse正是一个解决这个问题的轻量级 jQuery 折叠插件它仅约1kb压缩后 ~1.2kb就能让你的页面内容实现「渐进式披露」progressive disclosure——先展示标题点击后再展开详情。无论你是新手还是老手3 分钟即可读懂它的核心玩法。为什么选择 jQuery-Collapse✨特性说明 极致轻量约 1.2kbmin gzip加载几乎无感♿ 无障碍友好内置 WAI-ARIA 属性aria-expanded、aria-hidden屏幕阅读器也能正确识别 浏览器兼容兼容 IE6、Firefox、Safari、Chrome、Opera要求 jQuery ≥ 1.7.0 手风琴模式同一容器内展开一节时自动收起其他节 状态持久化记住用户展开/收起的区块刷新页面不丢失核心实现非常小巧整个插件只有 173 行代码入口文件见 src/jquery.collapse.js。快速上手3 步开启内容折叠 第 1 步引入两个脚本jQuery 插件本体script srcjquery.min.js/script script srcjquery.collapse.js/script第 2 步给容器加上data-collapse属性。插件会自动把容器内的元素按「成对」处理——奇数项当标题偶数项当可折叠内容div>h2 classopen我默认是展开的/h2就这么简单——data-collapse属性会自动触发脚本无需任何手动初始化。两大进阶玩法手风琴 状态持久化 手风琴模式Accordion在属性值中写入accordion即可实现「展开一个、收起其他」的经典手风琴交互div>script srcjquery.collapse.js/script script srcjquery.collapse_storage.js/script插件会优先使用 HTML5localStorage不可用时自动降级到 Cookie再不行就优雅退化为普通折叠功能不受影响只是不记忆状态。持久化核心读写逻辑位于 src/jquery.collapse_storage.js针对 IE6-7 的 Cookie 降级方案在 src/jquery.collapse_cookie_storage.js。 两种模式可以叠加data-collapseaccordion persist。常用配置选项与事件速查 ⚙️不满足于 HTML 属性写法可以用 jQuery 方式初始化并传参见 src/jquery.collapse.js选项类型作用open/close函数自定义展开/收起动画如this.slideDown(100)accordion布尔开启手风琴模式persist布尔开启状态持久化query字符串自定义标题元素的选择器适配复杂 DOM 结构clickQuery字符串指定标题内哪个元素响应点击避免与标题里的超链接冲突事件方面监听状态变化bind(opened)/bind(closed)主动控制对容器触发open全部展开、close全部收起、toggle切换事件即可。例如「一键展开全部」只需一行$(#demo).trigger(open)。项目结构与延伸阅读 路径说明src/jquery.collapse.js插件核心折叠、手风琴、ARIA 属性、事件分发src/jquery.collapse_storage.jslocalStorage 持久化模块src/jquery.collapse_cookie_storage.jsIE6-7 Cookie 降级方案demo/demo.html官方演示页涵盖默认/手风琴/持久化/自定义动画等全部示例test/CoffeeScript 测试用例Mocha Chai SinonREADME.md完整 API 文档LICENSEMIT / BSD / GPL 多协议想本地跑起来克隆仓库后执行npm install npm testKarma 会自动打开 Chrome 和 Firefox 运行测试。git clone https://gitcode.com/gh_mirrors/jq/jQuery-Collapse总结jQuery-Collapse 用不到 1kb 的体积、173 行源码提供了折叠、手风琴、持久化、自定义动画、无障碍支持等一整套内容渐进式披露能力。对于 FAQ 页面、产品参数页、长文章目录等场景它是一个「小而美」的终极选择。打开 demo/demo.html 亲手点一点感受它顺滑的交互吧赞分享【免费下载链接】jQuery-CollapseA lightweight (~1kb) jQuery plugin that enables expanding and collapsing content项目地址https://gitcode.com/gh_mirrors/jq/jQuery-Collapse点击查看免费下载相关推荐告别复杂配置OpenCore Auxiliary Tools 让你10分钟搞定黑苹果告别复杂配置OpenCore Auxiliary Tools 让你10分钟搞定黑苹果 还在为黑苹果配置头疼吗 面对复杂的plist文件和繁琐的驱动设置桌面应用开发工具KOReader 电子墨水阅读器指南让 PDF 和 EPUB 在小屏上读得舒服的完整路径KOReader 电子墨水阅读器指南让 PDF 和 EPUB 在小屏上读得舒服的完整路径 KOReader 是一款面向 Kindle、Kobo、PocketB嵌入式桌面应用实战微调 Surya OCR为业务场景打造专属文档识别模型实战微调 Surya OCR为业务场景打造专属文档识别模型 Surya 是一个支持 90 多种语言的文档 OCR 项目一次推理同时给出文字识别、版面布局、阅计算机视觉深度学习文档上一篇解锁Wii U游戏内容cdecrypt解密工具全解析下一篇胡桃工具箱把原神账号数据、祈愿记录与养成规划搬到桌面端的开源方案创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED

相关推荐

C++将字符串转换为整数和浮点数的几种方法

C++将字符串转换为整数和浮点数的几种方法

1. 常见的字符串转整数方法1.1 atoi()atoi 是C语言中最简单、最基础的字符串转整数函数。它接受一个字符串并返回对应的整数值。1int atoi(const char *str);优点:简单易用,适合处理非常基础的字符串转整数操作。缺点:没有错误处理机制。如果…

📅 2026/11/5 1:30:57
OpenCreator:Codex 内核的开源 AI 创作工作台

OpenCreator:Codex 内核的开源 AI 创作工作台

OpenCreator:Codex 内核的开源 AI 创作工作台 【免费下载链接】OpenCreator Formerly KrillinAI, VideoTranslation and Dubbing Tool for 120 Languages. Open-source AI workspace for creators, powered by Codex. Video downloader, video translation, create …

📅 2026/11/5 1:25:57
API调试工具汇总:Apifox、Reqable、Bruno、Insomnia、Yaak、WebCurl

API调试工具汇总:Apifox、Reqable、Bruno、Insomnia、Yaak、WebCurl

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

📅 2026/11/5 1:25:57
MORE NEWS

更多资讯

📰

2025年Data Agent技术演进与行业应用解析

1. 榜单背景与行业价值2025年中国大数据产业正经历从规模扩张向价值深挖的关键转型期。Data Agent(数据智能体)作为融合大模型与垂直场景的新范式,正在重构企业数据应用的基础架构。金猿奖作为国内大数据领域最具公信力的行业奖项之一&#x…

📰

有感FOC三环实现:时序分层、PI整定与轨迹规划

简介:面向电机控制与嵌入式开发学习者的有感FOC位置、速度与电流三环算法实现资料,围绕坐标变换、PID调节、SVPWM调制、编码器反馈与电流采样等关键环节展开,代码在STM32F4平台上运行,适合希望理解有感控制链路、搭建实验样机或对…

📰

STM32 FATFS SD卡读写:diskio、扇区寻址与写同步避坑

简介:面向嵌入式学习者与需在STM32上实现存储读写的开发者,这份资料展示KEIL环境下通过SPI或SDIO驱动SD卡并挂载FATFS的完整思路,涉及引脚配置、扇区读写、FATFS裁剪及f_open、f_read等文件操作,也包含未检测到卡、文件不存在、读…

📰

AI时代工程师转型:从编码到架构设计的技能升级

1. 从代码编写到架构设计:AI如何重塑工程师角色十年前我刚入行时,工程师的核心竞争力是能写出高效可靠的代码。现在打开GitHub Copilot,它能在几秒内生成比我当年更规范的函数实现。上周团队新来的应届生用GPT-4重构了我们的日志模块&#xf…

📰

基于DWVD与MCNN的机械故障诊断方法研究

1. 项目概述这个项目提出了一种创新的机械故障诊断方法,将时频分析领域的离散韦格纳分布(DWVD)与深度学习中的多尺度卷积神经网络(MCNN)相结合。作为一名长期从事机械状态监测的工程师,我深知传统故障诊断方…

📰

GEC2410 WinCE底层实验包:手册与源码对照实战指南

简介:这份资源面向嵌入式系统初学者与进阶开发者,围绕三星S3C2410(ARM920T内核)硬件平台与Windows CE系统的集成开发展开,提供实验手册与配套源码,帮助读者理解从系统架构、硬件接口到驱动与应用程序开发的…

TODAY

今日更新

THIS WEEK

本周精选

THIS MONTH

本月热门

读完文章,想聊聊您的网站?

告诉我们您的行业与需求,资深顾问一对一梳理方案与报价,全程免费。

📞 💬