Files
deep/hand-kimi.html
T
2026-04-27 17:55:26 +08:00

839 lines
52 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>隼瞻科技 - 深色主题页眉页脚</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
screens: {
'tablet': '1024px',
'sm': '640px',
'md': '768px',
'lg': '1280px',
'xl': '1536px',
},
extend: {
colors: {
primary: '#3b82f6',
secondary: '#0E42D2',
accent: '#69b1ff',
dark: '#0f172a',
light: '#f8fafc',
darkBg: '#1e293b',
darkerBg: '#0f172a',
darkCard: '#334155'
},
fontFamily: {
inter: ['Inter', 'sans-serif'],
},
},
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.content-auto {
content-visibility: auto;
}
.text-shadow {
text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.text-gradient {
background-clip: text;
-webkit-background-clip: text;
color: transparent;
}
.bg-grid {
background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23334155' fill-opacity='0.1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
}
/* 修复桌面端子菜单显示问题 */
.dropdown-submenu:hover > .submenu {
opacity: 1 !important;
visibility: visible !important;
transform: scale(1) !important;
}
.submenu {
pointer-events: auto;
}
.dropdown-submenu {
position: relative;
}
/* 确保三级菜单有足够的z-index */
.submenu-level-3 {
z-index: 9999 !important;
}
/* 全宽度mega菜单样式 */
.nav-mega-menu {
position: static;
}
.mega-dropdown {
top: 100%;
}
/* mega菜单卡片hover效果 */
.mega-menu-item {
min-height: 140px;
}
.mega-menu-item:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}
/* 汉堡按钮动画样式 */
.hamburger-line {
display: block;
width: 24px;
height: 2px;
background-color: currentColor;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
transform-origin: center;
}
.hamburger-active .hamburger-line:nth-child(1) {
transform: translateY(8px) rotate(45deg);
}
.hamburger-active .hamburger-line:nth-child(2) {
opacity: 0;
transform: scaleX(0);
}
.hamburger-active .hamburger-line:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
}
/* 移动端菜单遮罩层 */
.mobile-menu-overlay {
backdrop-filter: blur(8px);
transition: opacity 0.4s ease, visibility 0.4s ease;
}
/* 移动端菜单面板动画 */
.mobile-menu-panel {
transform: translateX(100%);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.mobile-menu-panel.active {
transform: translateX(0);
}
/* 菜单项级联动画 */
.mobile-menu-item {
opacity: 0;
transform: translateX(30px);
transition: opacity 0.4s ease, transform 0.4s ease;
}
.mobile-menu-panel.active .mobile-menu-item {
opacity: 1;
transform: translateX(0);
}
/* 为每个菜单项设置递增的延迟 */
.mobile-menu-panel.active .mobile-menu-item:nth-child(1) { transition-delay: 0.05s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(2) { transition-delay: 0.1s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(3) { transition-delay: 0.15s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(4) { transition-delay: 0.2s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(5) { transition-delay: 0.25s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(6) { transition-delay: 0.3s; }
.mobile-menu-panel.active .mobile-menu-item:nth-child(7) { transition-delay: 0.35s; }
/* 手风琴动画 */
.accordion-content {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s cubic-bezier(0, 1, 0, 1), opacity 0.4s ease;
opacity: 0;
}
.accordion-content.open {
max-height: 1000px;
opacity: 1;
transition: max-height 0.4s ease-in-out, opacity 0.4s ease;
}
.accordion-icon {
transition: transform 0.3s ease;
}
.accordion-icon.rotated {
transform: rotate(180deg);
}
/* 霓虹光效边框 */
.neon-border {
position: relative;
}
.neon-border::before {
content: '';
position: absolute;
inset: -1px;
background: linear-gradient(45deg, #3b82f6, #8b5cf6, #3b82f6);
border-radius: inherit;
z-index: -1;
opacity: 0;
transition: opacity 0.3s ease;
}
.neon-border:hover::before {
opacity: 1;
}
/* 移除移动端按钮的焦点和激活状态的蓝色底框 */
#mobile-menu-button,
.mobile-dropdown-toggle {
outline: none !important;
-webkit-tap-highlight-color: transparent !important;
-webkit-touch-callout: none !important;
-webkit-user-select: none !important;
-moz-user-select: none !important;
-ms-user-select: none !important;
user-select: none !important;
}
#mobile-menu-button:focus,
#mobile-menu-button:active,
#mobile-menu-button:hover,
.mobile-dropdown-toggle:focus,
.mobile-dropdown-toggle:active,
.mobile-dropdown-toggle:hover {
outline: none !important;
box-shadow: none !important;
background-color: transparent !important;
border: none !important;
}
/* 自定义滚动条 */
.custom-scrollbar::-webkit-scrollbar {
width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.05);
}
.custom-scrollbar::-webkit-scrollbar-thumb {
background: rgba(59, 130, 246, 0.5);
border-radius: 2px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
background: rgba(59, 130, 246, 0.8);
}
</style>
</head>
<body class="font-inter bg-darkerBg text-gray-200 min-h-screen flex flex-col">
<!-- 导航栏(页眉) -->
<header id="navbar" class="fixed w-full top-0 z-50 transition-all duration-300 bg-darkBg/70 backdrop-blur-sm shadow-md">
<div class="container mx-auto px-8 sm:px-12 lg:px-16 max-w-7xl">
<div class="flex justify-between items-center py-4">
<!-- Logo -->
<div class="flex items-center space-x-2">
<a href="https://www.beiyuxing.tech/" class="flex items-center">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2025/10/20251021-101134.png" alt="隼瞻科技" class="h-12 w-36 object-contain">
</a>
</div>
<!-- 桌面导航菜单 -->
<nav class="hidden tablet:flex items-center space-x-8">
<!-- 首页 -->
<div class="relative group">
<a href="https://www.beiyuxing.tech/" class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">首页</a>
</div>
<!-- 产品中心 -->
<div class="relative group nav-mega-menu">
<a class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors flex items-center cursor-pointer">
产品中心
<i class="fa fa-chevron-down ml-1 text-xs transition-transform group-hover:rotate-180 duration-300"></i>
</a>
<!-- 全宽度下拉菜单 -->
<div class="mega-dropdown fixed left-0 right-0 mt-0 bg-darkCard/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-gray-700">
<div class="container mx-auto px-8 py-8 max-w-7xl">
<div class="grid grid-cols-5 gap-6">
<!-- RISC-V处理器IP带三级菜单 -->
<div class="relative dropdown-submenu col-span-1">
<a class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item cursor-pointer border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-blue-500/20 to-purple-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-microchip text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">RISC-V处理器IP</span>
<i class="fa fa-chevron-right mt-2 text-xs text-gray-500 group-hover/item:text-white transition-colors"></i>
</a>
<!-- 三级菜单 - 三列布局 -->
<div class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-darkCard rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-[420px] border border-gray-700">
<div class="grid grid-cols-3 gap-1 p-4">
<!-- 通用处理器IP -->
<div class="p-2">
<div class="px-3 py-2 text-xs font-semibold text-primary border-b border-primary/20 mb-2">通用处理器IP</div>
<a href="https://www.beiyuxing.tech/wing-m050/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M050</a>
<a href="https://www.beiyuxing.tech/wing-m130/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130</a>
<a href="https://www.beiyuxing.tech/wing-m510/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M510</a>
<a href="https://www.beiyuxing.tech/wing-a500/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-A500</a>
<a href="products.html#wing-a700" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-A700</a>
</div>
<!-- 车规处理器IP -->
<div class="p-2">
<div class="px-3 py-2 text-xs font-semibold text-primary border-b border-primary/20 mb-2">车规处理器IP</div>
<a href="products.html#wing-m050a" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M050A</a>
<a href="https://www.beiyuxing.tech/wing-m130a/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130A</a>
<a href="products.html#wing-m510a" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M510A</a>
</div>
<!-- 安全处理器IP -->
<div class="p-2">
<div class="px-3 py-2 text-xs font-semibold text-primary border-b border-primary/20 mb-2">安全处理器IP</div>
<a href="https://www.beiyuxing.tech/wing-m050s/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M050S</a>
<a href="https://www.beiyuxing.tech/wing-m130s/" class="block py-2 px-3 text-xs text-gray-300 hover:bg-white/10 hover:text-white rounded transition-colors">Wing-M130S</a>
</div>
</div>
</div>
</div>
<!-- ArchitStudio开发平台 -->
<a href="https://www.beiyuxing.tech/architstudio-2/" class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-green-500/20 to-teal-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-desktop text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">ArchitStudio开发平台</span>
</a>
<!-- 智翼端侧AI解决方案 -->
<a href="https://www.beiyuxing.tech/%e6%99%ba%e7%bf%bc%e7%ab%af%e4%be%a7ai%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/" class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-orange-500/20 to-red-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-lightbulb-o text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">智翼端侧AI解决方案</span>
</a>
<!-- 配套开发工具 -->
<a href="https://www.beiyuxing.tech/wlink/" class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-cyan-500/20 to-blue-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-wrench text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">配套开发工具</span>
</a>
<!-- FPGA -->
<a href="https://www.beiyuxing.tech/fpga/" class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-purple-500/20 to-pink-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-cubes text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">FPGA</span>
</a>
</div>
</div>
</div>
</div>
<!-- 技术中心 -->
<div class="relative group nav-mega-menu">
<a class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors flex items-center cursor-pointer">
技术中心
<i class="fa fa-chevron-down ml-1 text-xs transition-transform group-hover:rotate-180 duration-300"></i>
</a>
<!-- 全宽度下拉菜单 -->
<div class="mega-dropdown fixed left-0 right-0 mt-0 bg-darkCard/95 backdrop-blur-md shadow-2xl overflow-visible opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 transform origin-top scale-y-95 group-hover:scale-y-100 z-50 border-t border-b border-gray-700">
<div class="container mx-auto px-8 py-8 max-w-7xl">
<div class="grid grid-cols-3 gap-6 max-w-3xl mx-auto">
<!-- IP相关技术带三级菜单 -->
<div class="relative dropdown-submenu">
<a class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item cursor-pointer border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-indigo-500/20 to-blue-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-cogs text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">IP相关技术</span>
<i class="fa fa-chevron-right mt-2 text-xs text-gray-500 group-hover/item:text-white transition-colors"></i>
</a>
<!-- 三级菜单 -->
<div class="submenu submenu-level-3 absolute left-full top-0 ml-2 bg-darkCard rounded-xl shadow-2xl overflow-hidden opacity-0 invisible transition-all duration-300 w-56 border border-gray-700">
<a href="https://www.beiyuxing.tech/%e4%bb%a3%e7%a0%81%e5%8e%8b%e7%bc%a9%e6%8a%80%e6%9c%af/" class="flex items-center px-5 py-4 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors">
<i class="fa fa-compress mr-3 text-gray-400"></i>
代码压缩技术
</a>
<a href="https://www.beiyuxing.tech/%e4%b8%ad%e6%96%ad%e5%ae%9e%e6%97%b6%e6%80%a7%e6%8a%80%e6%9c%af/" class="flex items-center px-5 py-4 text-sm text-gray-300 hover:bg-white/10 hover:text-white transition-colors">
<i class="fa fa-bolt mr-3 text-gray-400"></i>
中断实时性技术
</a>
</div>
</div>
<!-- AI融合技术 -->
<a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1447/" class="mega-menu-item flex flex-col items-center justify-center p-6 rounded-xl bg-gray-800/50 hover:bg-gray-700/50 transition-all duration-300 text-center group/item border border-gray-700/50 hover:border-gray-600">
<div class="w-14 h-14 rounded-xl bg-gradient-to-br from-yellow-500/20 to-orange-500/20 flex items-center justify-center mb-4 group-hover/item:scale-110 transition-transform">
<i class="fa fa-magic text-2xl text-gray-300 group-hover/item:text-white"></i>
</div>
<span class="text-sm font-medium text-gray-300 group-hover/item:text-white">AI融合技术</span>
</a>
<!-- 占位 - 保持对称 -->
<div class="hidden"></div>
</div>
</div>
</div>
</div>
<!-- 新闻中心 -->
<div class="relative group">
<a href="https://www.beiyuxing.tech/news/" class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">新闻中心</a>
</div>
<!-- 关于我们 -->
<div class="relative group">
<a href="https://www.beiyuxing.tech/about/" class="py-2 px-1 text-sm font-medium text-gray-300 hover:text-white transition-colors">关于我们</a>
</div>
<!-- 加入按钮 -->
<a href="https://www.beiyuxing.tech/position/" class="ml-4 px-4 py-2 bg-primary text-white rounded-md text-sm font-medium hover:bg-white hover:text-dark transition-colors">加入我们</a>
</nav>
<!-- 移动端菜单按钮 - 美化版 -->
<div class="tablet:hidden">
<button id="mobile-menu-button" type="button" class="relative w-10 h-10 flex flex-col items-center justify-center space-y-1.5 text-gray-300 hover:text-white transition-colors focus:outline-none z-50">
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
</button>
</div>
</div>
</div>
</header>
<!-- 移动端导航菜单 - 全屏滑出式 -->
<div id="mobile-menu-overlay" class="mobile-menu-overlay fixed inset-0 bg-black/60 z-40 opacity-0 invisible tablet:hidden"></div>
<div id="mobile-menu-panel" class="mobile-menu-panel fixed top-0 right-0 h-full w-[85vw] max-w-[360px] bg-gradient-to-b from-darkBg to-darkerBg z-50 shadow-2xl tablet:hidden border-l border-gray-700/50">
<!-- 装饰性背景元素 -->
<div class="absolute top-0 left-0 w-full h-32 bg-gradient-to-b from-primary/10 to-transparent pointer-events-none"></div>
<div class="absolute top-20 right-0 w-64 h-64 bg-primary/5 rounded-full blur-3xl pointer-events-none"></div>
<!-- 菜单头部 -->
<div class="relative flex items-center justify-between p-6 border-b border-gray-700/50">
<span class="text-lg font-semibold text-white">菜单</span>
<button id="mobile-menu-close" class="w-8 h-8 flex items-center justify-center rounded-full bg-gray-800/50 text-gray-400 hover:text-white hover:bg-gray-700/50 transition-all">
<i class="fa fa-times text-sm"></i>
</button>
</div>
<!-- 菜单内容 - 可滚动区域 -->
<div class="relative h-[calc(100%-80px)] overflow-y-auto custom-scrollbar py-4 px-4">
<nav class="space-y-1">
<!-- 首页 -->
<div class="mobile-menu-item">
<a href="https://www.beiyuxing.tech/" class="flex items-center py-3 px-4 text-base font-medium text-gray-300 hover:text-white hover:bg-white/5 rounded-xl transition-all group">
<span class="w-8 h-8 flex items-center justify-center rounded-lg bg-gray-800/50 mr-3 group-hover:bg-primary/20 transition-colors">
<i class="fa fa-home text-sm text-gray-400 group-hover:text-primary"></i>
</span>
首页
</a>
</div>
<!-- 产品中心 -->
<div class="mobile-menu-item">
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-3 px-4 text-base font-medium text-gray-300 hover:text-white hover:bg-white/5 rounded-xl transition-all group">
<div class="flex items-center">
<span class="w-8 h-8 flex items-center justify-center rounded-lg bg-gray-800/50 mr-3 group-hover:bg-primary/20 transition-colors">
<i class="fa fa-cube text-sm text-gray-400 group-hover:text-primary"></i>
</span>
产品中心
</div>
<i class="accordion-icon fa fa-chevron-down text-xs text-gray-500 transition-transform duration-300"></i>
</button>
<div class="accordion-content pl-4">
<div class="py-2 space-y-1 border-l-2 border-gray-700/50 ml-7 pl-4">
<!-- RISC-V处理器IP -->
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-2 px-3 text-sm font-medium text-gray-400 hover:text-white rounded-lg transition-colors">
<span>RISC-V处理器IP</span>
<i class="accordion-icon fa fa-chevron-down text-xs transition-transform duration-300"></i>
</button>
<div class="accordion-content">
<div class="py-2 space-y-1">
<!-- 通用处理器IP -->
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-2 px-3 text-xs text-gray-500 hover:text-gray-300 rounded-lg transition-colors">
<span>通用处理器IP</span>
<i class="accordion-icon fa fa-chevron-down text-xs transition-transform duration-300"></i>
</button>
<div class="accordion-content">
<div class="py-1 space-y-1">
<a href="https://www.beiyuxing.tech/wing-m050/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M050</a>
<a href="https://www.beiyuxing.tech/wing-m130/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M130</a>
<a href="https://www.beiyuxing.tech/wing-m510/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M510</a>
<a href="https://www.beiyuxing.tech/wing-a500/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-A500</a>
</div>
</div>
</div>
<!-- 车规处理器IP -->
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-2 px-3 text-xs text-gray-500 hover:text-gray-300 rounded-lg transition-colors">
<span>车规处理器IP</span>
<i class="accordion-icon fa fa-chevron-down text-xs transition-transform duration-300"></i>
</button>
<div class="accordion-content">
<div class="py-1 space-y-1">
<a href="https://www.beiyuxing.tech/wing-m050a/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M050A</a>
<a href="https://www.beiyuxing.tech/wing-m130a/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M130A</a>
</div>
</div>
</div>
<!-- 安全处理器IP -->
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-2 px-3 text-xs text-gray-500 hover:text-gray-300 rounded-lg transition-colors">
<span>安全处理器IP</span>
<i class="accordion-icon fa fa-chevron-down text-xs transition-transform duration-300"></i>
</button>
<div class="accordion-content">
<div class="py-1 space-y-1">
<a href="https://www.beiyuxing.tech/wing-m050s/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M050S</a>
<a href="https://www.beiyuxing.tech/wing-m130s/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">Wing-M130S</a>
</div>
</div>
</div>
</div>
</div>
</div>
<a href="https://www.beiyuxing.tech/architstudio-2/" class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors">
ArchitStudio开发平台
</a>
<a href="https://www.beiyuxing.tech/%e6%99%ba%e7%bf%bc%e7%ab%af%e4%be%a7ai%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/" class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors">
智翼端侧AI解决方案
</a>
<a href="https://www.beiyuxing.tech/wlink/" class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors">
配套开发工具
</a>
<a href="https://www.beiyuxing.tech/fpga/" class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors">
FPGA
</a>
</div>
</div>
</div>
</div>
<!-- 技术中心 -->
<div class="mobile-menu-item">
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-3 px-4 text-base font-medium text-gray-300 hover:text-white hover:bg-white/5 rounded-xl transition-all group">
<div class="flex items-center">
<span class="w-8 h-8 flex items-center justify-center rounded-lg bg-gray-800/50 mr-3 group-hover:bg-primary/20 transition-colors">
<i class="fa fa-flask text-sm text-gray-400 group-hover:text-primary"></i>
</span>
技术中心
</div>
<i class="accordion-icon fa fa-chevron-down text-xs text-gray-500 transition-transform duration-300"></i>
</button>
<div class="accordion-content pl-4">
<div class="py-2 space-y-1 border-l-2 border-gray-700/50 ml-7 pl-4">
<div class="accordion-item">
<button class="accordion-trigger w-full flex items-center justify-between py-2 px-3 text-sm font-medium text-gray-400 hover:text-white rounded-lg transition-colors">
<span>IP相关技术</span>
<i class="accordion-icon fa fa-chevron-down text-xs transition-transform duration-300"></i>
</button>
<div class="accordion-content">
<div class="py-1 space-y-1">
<a href="https://www.beiyuxing.tech/%e4%bb%a3%e7%a0%81%e5%8e%8b%e7%bc%a9%e6%8a%80%e6%9c%af/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">代码压缩技术</a>
<a href="https://www.beiyuxing.tech/%e4%b8%ad%e6%96%ad%e5%ae%9e%e6%97%b6%e6%80%a7%e6%8a%80%e6%9c%af/" class="block py-1.5 px-3 text-xs text-gray-500 hover:text-primary hover:pl-4 transition-all">中断实时性技术</a>
</div>
</div>
</div>
<a href="https://www.beiyuxing.tech/ai%e8%9e%8d%e5%90%88%e6%8a%80%e6%9c%af/" class="block py-2 px-3 text-sm text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors">
AI融合技术
</a>
</div>
</div>
</div>
</div>
<!-- 新闻中心 -->
<div class="mobile-menu-item">
<a href="https://www.beiyuxing.tech/news/" class="flex items-center py-3 px-4 text-base font-medium text-gray-300 hover:text-white hover:bg-white/5 rounded-xl transition-all group">
<span class="w-8 h-8 flex items-center justify-center rounded-lg bg-gray-800/50 mr-3 group-hover:bg-primary/20 transition-colors">
<i class="fa fa-newspaper-o text-sm text-gray-400 group-hover:text-primary"></i>
</span>
新闻中心
</a>
</div>
<!-- 关于我们 -->
<div class="mobile-menu-item">
<a href="https://www.beiyuxing.tech/about/" class="flex items-center py-3 px-4 text-base font-medium text-gray-300 hover:text-white hover:bg-white/5 rounded-xl transition-all group">
<span class="w-8 h-8 flex items-center justify-center rounded-lg bg-gray-800/50 mr-3 group-hover:bg-primary/20 transition-colors">
<i class="fa fa-info-circle text-sm text-gray-400 group-hover:text-primary"></i>
</span>
关于我们
</a>
</div>
<!-- 加入我们按钮 -->
<div class="mobile-menu-item pt-4">
<a href="https://www.beiyuxing.tech/position/" class="flex items-center justify-center py-3 px-4 bg-gradient-to-r from-primary to-secondary text-white rounded-xl font-medium shadow-lg shadow-primary/25 hover:shadow-primary/40 transform hover:scale-[1.02] transition-all neon-border overflow-hidden">
<i class="fa fa-user-plus mr-2"></i>
加入我们
</a>
</div>
</nav>
<!-- 底部装饰 -->
<div class="mt-8 pt-6 border-t border-gray-700/50">
<div class="flex justify-center space-x-6">
<a href="#" class="w-10 h-10 flex items-center justify-center rounded-full bg-gray-800/50 text-gray-400 hover:text-white hover:bg-primary/20 transition-all">
<i class="fa fa-weixin"></i>
</a>
<a href="#" class="w-10 h-10 flex items-center justify-center rounded-full bg-gray-800/50 text-gray-400 hover:text-white hover:bg-primary/20 transition-all">
<i class="fa fa-weibo"></i>
</a>
<a href="#" class="w-10 h-10 flex items-center justify-center rounded-full bg-gray-800/50 text-gray-400 hover:text-white hover:bg-primary/20 transition-all">
<i class="fa fa-linkedin"></i>
</a>
</div>
<p class="text-center text-xs text-gray-600 mt-4">© 2024 隼瞻科技</p>
</div>
</div>
</div>
<!-- 页脚 -->
<footer class="bg-darkerBg text-white py-16 border-t border-gray-800 mt-auto">
<div class="container mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10">
<!-- 公司信息 -->
<div>
<div class="flex items-center space-x-2 mb-6">
<div class="w-32 h-10 rounded-lg flex items-center justify-center overflow-hidden">
<img src="https://www.beiyuxing.tech/wp-content/uploads/2025/10/20251021-101134.png" alt="公司Logo" class="w-full h-full object-contain" />
</div>
</div>
<p class="text-gray-400 mb-6 text-sm leading-relaxed">
隼瞻科技是一家专注于提供专用处理器IP和EDA设计平台的创新型高科技公司,致力于为客户提供高性能、低功耗的处理器IP和先进的EDA设计工具。
</p>
<div class="flex space-x-4">
<a href="#" class="w-8 h-8 flex items-center justify-center rounded-full bg-gray-800 text-gray-400 hover:text-white hover:bg-primary transition-all">
<i class="fa fa-weixin"></i>
</a>
<a href="#" class="w-8 h-8 flex items-center justify-center rounded-full bg-gray-800 text-gray-400 hover:text-white hover:bg-primary transition-all">
<i class="fa fa-weibo"></i>
</a>
<a href="#" class="w-8 h-8 flex items-center justify-center rounded-full bg-gray-800 text-gray-400 hover:text-white hover:bg-primary transition-all">
<i class="fa fa-linkedin"></i>
</a>
</div>
</div>
<!-- 产品 -->
<div>
<h3 class="text-lg font-bold mb-6">产品</h3>
<ul class="space-y-3">
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1465/" class="text-gray-400 hover:text-white transition-colors text-sm">ArchitStudio开发平台</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1442/" class="text-gray-400 hover:text-white transition-colors text-sm">智翼端侧AI解决方案</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1524/" class="text-gray-400 hover:text-white transition-colors text-sm">配套开发工具</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1532/" class="text-gray-400 hover:text-white transition-colors text-sm">FPGA</a></li>
</ul>
</div>
<!-- 服务 -->
<div>
<h3 class="text-lg font-bold mb-6">技术</h3>
<ul class="space-y-3">
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1447/" class="text-gray-400 hover:text-white transition-colors text-sm">AI融合技术</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1490/" class="text-gray-400 hover:text-white transition-colors text-sm">代码压缩技术</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1473/" class="text-gray-400 hover:text-white transition-colors text-sm">中断实时性技术</a></li>
</ul>
</div>
<!-- 关于我们 -->
<div>
<h3 class="text-lg font-bold mb-6">关于我们</h3>
<ul class="space-y-3">
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-725/" class="text-gray-400 hover:text-white transition-colors text-sm">公司简介</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-1173/" class="text-gray-400 hover:text-white transition-colors text-sm">加入我们</a></li>
<li><a href="https://www.beiyuxing.tech/elementor-%e9%a1%b5%e9%9d%a2-683/" class="text-gray-400 hover:text-white transition-colors text-sm">新闻动态</a></li>
</ul>
</div>
</div>
<div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center mt-12">
<p class="text-gray-500 text-sm mb-4 md:mb-0">
&copy; <span id="current-year">2024</span> 隼瞻科技. 保留所有权利.
</p>
<div class="flex space-x-6">
<a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">隐私政策</a>
<a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">使用条款</a>
<a href="#" class="text-gray-500 hover:text-gray-400 text-sm transition-colors">法律声明</a>
</div>
</div>
</div>
</footer>
<!-- 返回顶部按钮 -->
<button id="back-to-top" class="fixed bottom-6 right-6 w-12 h-12 bg-primary text-white rounded-full flex items-center justify-center shadow-lg opacity-0 invisible transition-all duration-300 hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 focus:ring-offset-darkerBg z-30">
<i class="fa fa-arrow-up"></i>
</button>
<!-- JavaScript -->
<script>
(function() {
'use strict';
// 导航栏滚动效果
const navbar = document.getElementById('navbar');
const backToTop = document.getElementById('back-to-top');
if (navbar) {
window.addEventListener('scroll', function() {
if (window.scrollY > 50) {
navbar.classList.add('py-2', 'shadow-md');
navbar.classList.remove('py-4');
if (backToTop) {
backToTop.classList.remove('opacity-0', 'invisible');
backToTop.classList.add('opacity-100', 'visible');
}
} else {
navbar.classList.add('py-4');
navbar.classList.remove('py-2', 'shadow-md');
if (backToTop) {
backToTop.classList.add('opacity-0', 'invisible');
backToTop.classList.remove('opacity-100', 'visible');
}
}
});
}
// 移动端菜单控制
const mobileMenuButton = document.getElementById('mobile-menu-button');
const mobileMenuClose = document.getElementById('mobile-menu-close');
const mobileMenuPanel = document.getElementById('mobile-menu-panel');
const mobileMenuOverlay = document.getElementById('mobile-menu-overlay');
const body = document.body;
function openMobileMenu() {
mobileMenuButton.classList.add('hamburger-active');
mobileMenuPanel.classList.add('active');
mobileMenuOverlay.classList.remove('opacity-0', 'invisible');
mobileMenuOverlay.classList.add('opacity-100', 'visible');
body.style.overflow = 'hidden'; // 防止背景滚动
}
function closeMobileMenu() {
mobileMenuButton.classList.remove('hamburger-active');
mobileMenuPanel.classList.remove('active');
mobileMenuOverlay.classList.add('opacity-0', 'invisible');
mobileMenuOverlay.classList.remove('opacity-100', 'visible');
body.style.overflow = ''; // 恢复背景滚动
// 可选:关闭所有手风琴
setTimeout(() => {
document.querySelectorAll('.accordion-content').forEach(content => {
content.classList.remove('open');
});
document.querySelectorAll('.accordion-icon').forEach(icon => {
icon.classList.remove('rotated');
});
}, 300);
}
if (mobileMenuButton) {
mobileMenuButton.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
if (mobileMenuPanel.classList.contains('active')) {
closeMobileMenu();
} else {
openMobileMenu();
}
});
}
if (mobileMenuClose) {
mobileMenuClose.addEventListener('click', closeMobileMenu);
}
if (mobileMenuOverlay) {
mobileMenuOverlay.addEventListener('click', closeMobileMenu);
}
// 手风琴效果
const accordionTriggers = document.querySelectorAll('.accordion-trigger');
accordionTriggers.forEach(trigger => {
trigger.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
const content = this.nextElementSibling;
const icon = this.querySelector('.accordion-icon');
if (content && content.classList.contains('accordion-content')) {
// 切换当前项
if (content.classList.contains('open')) {
content.classList.remove('open');
if (icon) icon.classList.remove('rotated');
} else {
content.classList.add('open');
if (icon) icon.classList.add('rotated');
}
}
});
});
// 点击菜单内链接后关闭菜单
document.querySelectorAll('#mobile-menu-panel a').forEach(link => {
link.addEventListener('click', function() {
if (!this.nextElementSibling || !this.nextElementSibling.classList.contains('accordion-content')) {
closeMobileMenu();
}
});
});
// ESC键关闭菜单
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && mobileMenuPanel.classList.contains('active')) {
closeMobileMenu();
}
});
// 平滑滚动
document.querySelectorAll('a[href^="#"]').forEach(function(anchor) {
anchor.addEventListener('click', function(e) {
const targetId = this.getAttribute('href');
if (targetId === '#') return;
const targetElement = document.querySelector(targetId);
if (targetElement) {
e.preventDefault();
window.scrollTo({
top: targetElement.offsetTop - 80,
behavior: 'smooth'
});
}
});
});
// 返回顶部按钮
if (backToTop) {
backToTop.addEventListener('click', function() {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
}
// 设置当前年份
const currentYear = document.getElementById('current-year');
if (currentYear) {
currentYear.textContent = new Date().getFullYear();
}
})();
</script>
</body>
</html>