Count - Responsive Coming Soon Page

Count - Responsive Coming Soon Page

category移动应用
# 项目简介 The Count 是一款响应式"网站即将上线"页面模板,配备倒计时、动态菜单面板、联系表单和关于我们区域。提供图片轮播(Supersized)和 YouTube 视频(YTPlayer)两种背景模式,适合用于产品发布、活动预告等场景。 ## 技术栈 - HTML5 / CSS3(静态页面) - jQuery(交互与插件) - Supersized(图片轮播背景) - YTPlayer(YouTube 视频背景) - Skeleton CSS(响应式栅格) - Google Fonts(Bebas Neue、Big Noodle Titling Oblique) - PHP(联系表单后端) ## 项目结构 ``` thecounthtml-10/ ├── The-Count-v1-1-Template/ │ ├── image-background/ # 图片背景版 │ │ ├── index.html │ │ ├── send.php # 邮件发送 │ │ ├── css/ # 样式文件 │ │ ├── js/ # 脚本文件 │ │ └── twitter/ # Twitter 滚动条 │ └── video-background/ # 视频背景版(含 YTPlayer) │ ├── index.html │ ├── YTPlayer/ │ ├── css/ │ └── js/ └── The-Count-v1-1-Documentation/ # 官方文档 └── index.html ``` ## 核心文件说明 - `image-background/index.html` — 图片背景版主页面 - `video-background/index.html` — 视频背景版主页面 - `css/style.css` — 主样式表(含字体、布局、动画等) - `js/countdown.js` — 倒计时逻辑 - `js/contact-form.js` — 联系表单处理 - `send.php` — 表单数据邮件发送(需配置服务器) ## 快速开始 纯静态页面,直接用浏览器打开 `image-background/index.html` 或 `video-background/index.html` 即可预览。如需表单功能,需将文件部署到支持 PHP 的 Web 服务器并配置 `send.php` 中的收件邮箱。 ## 使用建议 - 图片版适合展示多张作品轮播;视频版需替换 `index.html` 中的 YouTube 视频 ID(查找 `kWQLkrYxmpc` 替换为你的视频) - 倒计时目标时间在 `js/countdown.js` 中配置 - 字体文件需随 CSS 中的路径一起部署,否则字体可能无法加载
help_outline

FAQ

Comments0
PublishedJan 20, 2026

Tech Stack

HTML