Flyex - 创意即将推出模板

Flyex - 创意即将推出模板

# 项目简介 Flyex 是一款创意"即将上线"(Coming Soon)页面模板,提供 7 种背景变体,支持单图、幻灯片轮播、YouTube/Vimeo/HTML5 视频背景以及 Ken Burns 动画效果。内置倒计时器、社交图标区和 MailChimp 邮件订阅功能,适合产品发布、活动宣传或网站维护页使用。 ## 技术栈 - HTML5 + CSS3 + 原生 JavaScript - jQuery 1.x + jQuery Easing 插件 - Slick 轮播插件 - MailChimp API(PHP 后端订阅接口) - Google Fonts(Raleway)+ Ionicons 图标字体 ## 项目结构 ``` flyexhtml-10/ ├── Flyex-v1-0-Template/ │ ├── index-*.html # 7 种背景变体页面 │ ├── subscribe.php # MailChimp 订阅接口 │ ├── css/ │ │ ├── style.css # 主体样式 │ │ └── plugins.css # 第三方插件样式 │ ├── fonts/ # Ionicons 字体文件 │ ├── img/ # 背景图与 Logo │ ├── js/ │ │ ├── flyex.js # 交互逻辑 │ │ └── plugins.js # Slick 等插件配置 │ └── mailchimp/inc/ # MailChimp SDK └── Flyex-v1-0-Documentation/ └── index.html # 官方文档 ``` ## 核心文件说明 - `index-*.html` — 不同背景类型的入口页面,可按需选用 - `css/style.css` — 核心样式表,定义布局、动画、响应式断点 - `css/plugins.css` — Slick 轮播插件的样式覆盖 - `js/flyex.js` — 倒计时器、页面切换、动画触发等交互实现 - `subscribe.php` — MailChimp 订阅接口,需填入 API Key 与 List ID - `mailchimp/inc/MailChimp.php` — MailChimp PHP SDK ## 快速开始 1. 根据需求选择合适的 `index-*.html` 作为入口(默认双击打开即可预览) 2. 若使用邮件订阅功能,编辑 `subscribe.php` 填入自己的 MailChimp API Key 和 List ID 3. 本地调试建议使用本地服务器(如 Live Server)以确保视频和脚本正常加载 ## 使用建议 模板中的背景图片位于 `img/` 目录,替换时保持相同文件名即可自动切换;倒计时目标日期在 `js/flyex.js` 中配置,找到对应注释修改即可。
help_outline

常见问题

评论0
发布时间Jan 20, 2026

技术栈

HTML