项目简介
Donaty 是一款由 Laralink 开发的慈善公益网站着陆页模板,采用响应式全屏布局,支持捐款表单、视频弹窗、图片画廊等慈善机构常用功能。适用于公益组织、众筹项目、志愿者招募等场景。
技术栈
- HTML5 / CSS3(静态页面)
- Bootstrap 5.x
- jQuery
- Slick Slider(轮播)
- WOW.js(动画效果)
- Light Gallery(图片画廊)
项目结构
text
donatyhtml-10/
└── Donaty - Template/
├── index.html # 首页
├── blog.html # 博客列表
├── blog-with-sidebar.html # 带侧边栏博客
├── blog-details.html # 博客详情
└── assets/
├── css/
│ ├── style.css # 主样式
│ ├── bootstrap.min.css
│ ├── animate.css
│ └── slick.min.css
├── js/
│ ├── main.js # 交互逻辑
│ └── jquery.min.js
├── img/ # 示例图片
└── fonts/ # 图标字体
核心文件说明
Donaty - Template/index.html— 首页入口,包含 Hero 轮播、捐款弹窗、团队展示等完整页面结构assets/js/main.js— 全部交互功能(预加载器、移动端菜单、粘性导航、计数器、滑块等 17 项模块)assets/css/style.css— 主样式表,定义主题色、排版、间距及所有组件样式Donaty - Documentation/index.html— 官方文档,包含文件结构说明与定制指南
快速开始
直接用浏览器打开 Donaty - Template/index.html 即可预览。如需本地服务器:
bash
# 使用 Python
python -m http.server 8000
# 使用 Node.js (npx)
npx serve
使用建议
- 修改首页中所有文字、图片路径(替换
assets/img/下的占位图)后即可使用 - 捐款表单为前端演示,如需实际收款功能需对接支付接口
- 模板已内置 SASS 文件,可通过修改 SCSS 变量快速更换主题色
