Personal-Wedsite

企业服务招聘案例ID：239881

Jim

13 年经验· 鹏珊玉器

微信扫码沟通，客服可协助直接对接工程师；如当前档期不合，也可继续推荐相似案例作者。

案例介绍

功能介绍

本项目六大功能模块包含：①响应式导航栏，支持点跳转与移动端折叠；②多语言切换模块，内置中文、中文、希腊语、德语、法语五种语言，实时渲染全站文字；③明暗切换，基于CSS标记实现一键切换，优先持久化存储于本地存储；④个人区，含浮动头如与更新文字标题动画介绍、浮动头像与更新文字标题动画板；⑤个人里程碑轴，以玻璃拟态升级展示节点；⑥交互留言与C++编码群聊模块，支持留言提交、消息和展示右键菜单操作，全站采用Glassmorphism设计语言，兼容桌面与移动端。项目实现

本人（Yjp--Dream）独立项目的全部设计与开发，具体包括：页面整体架构搭建、CSS主题变量系统设计、模板自动化效果与迁移动画式实现、多语言i18n数据结构设计及动态渲染负责逻辑、留言板交互模块开发，以及全站响应。技术亮点是：使用纯CSS自定义属性（--var）实现零JS的主题切换架构，配合loc alStorage持久化；通过JS实现订单效果字符逐写入结合CSS眨眼动画实现，消耗第三方库；Glassmorphism调节利用background-filter：模糊与半透明过渡，在低性能设备上也保持渲染渲染。难点采用多语言与主题状态的同步管理，通过统一的语言配置对象与初始化函数解决了竞争问题。