您的邀请函标题

commit 61a68ac84e4bed61daadc345863301cd5e815f12 Author: 齐斌 <1134087124@qq.com> Date: Fri Aug 15 18:14:14 2025 +0800 first commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..d377266 --- /dev/null +++ b/README.md @@ -0,0 +1,99 @@ +# H5 邀请函项目 + +这是一个优雅的H5邀请函项目，专为微信分享优化，支持小卡片形式的分享。 + +## 功能特点 + +- 📱 响应式设计，完美适配移动端 +- 🎨 优雅的渐变背景和动画效果 +- 💫 飘落动画和交互反馈 +- 📤 微信分享优化（小卡片显示） +- ✨ 确认参加功能 +- 🎉 庆祝动画效果 +- 📋 一键复制分享链接 + +## 文件结构 + +``` +expo-invite/ +├── index.html # 主页面文件 +├── style.css # 样式文件 +├── script.js # 交互脚本 +├── manifest.json # PWA配置文件 +├── images/ # 图片资源文件夹 +└── README.md # 说明文档 +``` + +## 使用方法 + +1. **直接使用**：将所有文件上传到Web服务器即可使用 +2. **本地预览**：使用本地服务器（如Live Server）预览效果 +3. **微信分享**：在微信中打开链接，点击右上角分享 + +## 自定义配置 + +### 修改邀请函内容 + +编辑 `index.html` 文件中的以下部分： + +```html + +

2024年12月25日 18:00

+ + +

北京市朝阳区某某酒店

+ + +138-0000-0000 +event@example.com +``` + +### 修改分享信息 + +在 `index.html` 的 `` 部分修改： + +```html + + + +``` + +### 自定义样式 + +编辑 `style.css` 文件来修改： +- 颜色主题（搜索 `#667eea` 和 `#764ba2`） +- 字体大小和间距 +- 动画效果 + +## 微信分享优化 + +项目已经配置了微信分享的meta标签，确保： + +1. 将 `share-image.jpg` 放置在 `images` 文件夹中 +2. 图片尺寸建议为 300x300 像素 +3. 确保图片链接可公网访问 + +## 浏览器兼容性 + +- ✅ iOS Safari 10+ +- ✅ Android Chrome 60+ +- ✅ 微信内置浏览器 +- ✅ QQ浏览器 +- ✅ UC浏览器 + +## 注意事项 + +1. 确保在HTTPS环境下使用以获得最佳体验 +2. 微信分享图片需要可公网访问 +3. 某些功能在本地文件系统中可能受限 + +## 技术栈 + +- HTML5 +- CSS3 (Flexbox, Grid, Animations) +- Vanilla JavaScript +- PWA支持 + +## 许可证 + +MIT License diff --git a/images/bg.png b/images/bg.png new file mode 100644 index 0000000..948d81e Binary files /dev/null and b/images/bg.png differ diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..84e6357 Binary files /dev/null and b/images/logo.png differ diff --git a/images/sharelogo.png b/images/sharelogo.png new file mode 100644 index 0000000..c5b4782 Binary files /dev/null and b/images/sharelogo.png differ diff --git a/images/subg1.png b/images/subg1.png new file mode 100644 index 0000000..930a7b3 Binary files /dev/null and b/images/subg1.png differ diff --git a/images/subg2.png b/images/subg2.png new file mode 100644 index 0000000..f737b7f Binary files /dev/null and b/images/subg2.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..ca8c45c --- /dev/null +++ b/index.html @@ -0,0 +1,312 @@ + + + + + + INVITATION LETTER - FIEE (HK) Limited + + + + + + + + + + + + + + + + + + + + + + + +

+ +

+ + +

+ +

INVITATION

LETTER

·Looking forward to coming

+ + +

Dear Sir/Madam:

+ +

+ We are pleased to invite you to visit and exchange at the MYDOME International Merchandise Expo in Osaka during Expo 2025. +

+ +

EXHIBITION DATES: August 26—28,2025

+ +

HOURS: Aug 26—27,10:00—17:00;Aug 28,10:00—16:00

+ +

VENUE: MYDOME OSAKA

+ +

ADDRESS: 2—5 Honmachibashi,Chuo-ku,Osaka

+ + +

FIEE (HK) Limited

+ + + + diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..c9e5f46 --- /dev/null +++ b/manifest.json @@ -0,0 +1,22 @@ +{ + "name": "邀请函 H5", + "short_name": "邀请函", + "description": "优雅的H5邀请函，支持微信分享", + "start_url": "./index.html", + "display": "standalone", + "background_color": "#667eea", + "theme_color": "#764ba2", + "orientation": "portrait", + "icons": [ + { + "src": "./images/icon-192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "./images/icon-512.png", + "sizes": "512x512", + "type": "image/png" + } + ] +}