70 lines
2.4 KiB
HTML
70 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<!--
|
|
项目地址: http://git.exyone.me/exyone/.exyone.me-html-homepage
|
|
作者: exyone
|
|
描述: 一个集成了多种实用工具的个人主页
|
|
创建时间: 2025年
|
|
版本: 1.0.0
|
|
-->
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>exyone的荒野小站</title>
|
|
<link rel="stylesheet" href="assets/css/style.css">
|
|
<!-- 核心JavaScript文件 -->
|
|
<script src="assets/js/wallpaper.js"></script>
|
|
<script src="assets/js/component-loader.js"></script>
|
|
<script src="assets/js/topbar.js"></script>
|
|
</head>
|
|
<body>
|
|
<!-- 背景容器 -->
|
|
<div class="nature-bg" id="bing-wallpaper"></div>
|
|
<!-- 顶部导航栏 -->
|
|
<nav class="top-nav">
|
|
<button class="mobile-menu-btn" id="mobile-menu">☰</button>
|
|
<!-- 导航链接容器 -->
|
|
<div id="nav-links-container"></div>
|
|
<!-- 快速链接容器 -->
|
|
<div id="quick-links-container"></div>
|
|
</nav>
|
|
<!-- 主内容区域 -->
|
|
<div class="main-container">
|
|
<!-- 左侧功能面板 -->
|
|
<div class="left-panel">
|
|
<!-- 时钟与搜索区域 -->
|
|
<div class="clock-search-container">
|
|
<!-- 数字时钟组件 -->
|
|
<div id="clock-component"></div>
|
|
<!-- 搜索组件 -->
|
|
<div id="search-component"></div>
|
|
</div>
|
|
<!-- 日历组件 -->
|
|
<div id="calendar-component"></div>
|
|
<!-- 模拟时钟组件 -->
|
|
<div id="analog-clock-component"></div>
|
|
<!-- 天气组件 -->
|
|
<div id="weather-component"></div>
|
|
<!-- 个人信息组件 -->
|
|
<div id="profile-component"></div>
|
|
<!-- 计算器组件 -->
|
|
<div id="calculator-component"></div>
|
|
<!-- 名言组件 -->
|
|
<div id="quotes-component"></div>
|
|
<!-- 倒计时组件 -->
|
|
<div id="countdown-component"></div>
|
|
</div>
|
|
</div>
|
|
<!-- 页面初始化脚本 -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
// 初始化背景壁纸
|
|
getBingWallpaper();
|
|
// 加载顶部导航组件（组件加载完成后会自动初始化移动端菜单）
|
|
loadTopBarComponents();
|
|
// 加载所有功能组件
|
|
loadAllComponents();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |