index.html 48 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <link rel="icon" type="image/x-icon" href="img/favicon.ico" />
  7. <title>Aisoco - Ai&Social&Commerce</title>
  8. <!-- Tailwind CSS -->
  9. <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"></script>
  10. <!-- Font Awesome -->
  11. <link
  12. href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css"
  13. rel="stylesheet"
  14. />
  15. <!-- Google Fonts - Inter (类似苹果官网字体风格) -->
  16. <link
  17. href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
  18. rel="stylesheet"
  19. />
  20. <!-- Tailwind Configuration -->
  21. <script>
  22. tailwind.config = {
  23. theme: {
  24. extend: {
  25. colors: {
  26. primary: '#0066CC',
  27. secondary: '#333333',
  28. light: '#F5F5F7',
  29. dark: '#1D1D1F',
  30. },
  31. fontFamily: {
  32. sans: ['Inter', 'sans-serif'],
  33. },
  34. },
  35. },
  36. };
  37. </script>
  38. <style type="text/tailwindcss">
  39. @layer utilities {
  40. .content-auto {
  41. content-visibility: auto;
  42. }
  43. .text-balance {
  44. text-wrap: balance;
  45. }
  46. .transition-smooth {
  47. transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
  48. }
  49. .timeline-dot::before {
  50. content: '';
  51. position: absolute;
  52. width: 16px;
  53. height: 16px;
  54. border-radius: 50%;
  55. background-color: #0066cc;
  56. left: -40px;
  57. top: 6px;
  58. }
  59. .timeline-line::before {
  60. content: '';
  61. position: absolute;
  62. width: 1px;
  63. height: 100%;
  64. background-color: #e2e2e2;
  65. left: -32px;
  66. top: 22px;
  67. }
  68. }
  69. </style>
  70. </head>
  71. <body class="font-sans bg-white text-dark antialiased">
  72. <!-- 语言切换器 -->
  73. <div class="py-2">
  74. <div class="container mx-auto px-4 flex justify-end">
  75. <button
  76. id="lang-en"
  77. class="language-btn text-sm font-medium text-primary mr-4"
  78. >
  79. <!-- English -->
  80. </button>
  81. <button
  82. id="lang-zh"
  83. class="language-btn text-sm font-medium text-gray-500"
  84. >
  85. <!-- 中文 -->
  86. </button>
  87. </div>
  88. </div>
  89. <!-- 导航栏 -->
  90. <header
  91. id="navbar"
  92. class="fixed w-full top-6 z-50 transition-all duration-300"
  93. >
  94. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  95. <nav class="flex justify-between items-center">
  96. <!-- Logo -->
  97. <a href="#home" class="text-2xl font-semibold tracking-tight"></a>
  98. <img
  99. src="./img/aisoco_logo.png"
  100. style="object-fit: cover; width: 160px"
  101. />
  102. </a>
  103. <!-- 桌面导航 -->
  104. <div class="hidden md:flex items-center space-x-8">
  105. <a
  106. href="#about"
  107. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  108. >About</a
  109. >
  110. <a
  111. href="#journey"
  112. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  113. >Journey</a
  114. >
  115. <a
  116. href="#vision"
  117. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  118. >Vision</a
  119. >
  120. <a
  121. href="#product"
  122. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  123. >Product</a
  124. >
  125. <a
  126. href="#team"
  127. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  128. >Team</a
  129. >
  130. <a
  131. href="#press"
  132. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  133. >Press</a
  134. >
  135. <a
  136. href="#contact"
  137. class="nav-link text-lg font-medium hover:text-primary transition-smooth"
  138. >Contact</a
  139. >
  140. </div>
  141. <!-- 移动端菜单按钮 -->
  142. <button
  143. id="menu-toggle"
  144. class="md:hidden text-dark focus:outline-none"
  145. >
  146. <i class="fa fa-bars text-xl"></i>
  147. </button>
  148. </nav>
  149. </div>
  150. <!-- 移动端导航菜单 -->
  151. <div id="mobile-menu" class="md:hidden hidden bg-white border-t mt-4">
  152. <div class="container mx-auto px-4 py-3 space-y-3">
  153. <a
  154. href="#about"
  155. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  156. >about</a
  157. >
  158. <a
  159. href="#journey"
  160. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  161. >journey</a
  162. >
  163. <a
  164. href="#vision"
  165. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  166. >vision</a
  167. >
  168. <a
  169. href="#product"
  170. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  171. >product</a
  172. >
  173. <a
  174. href="#team"
  175. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  176. >team</a
  177. >
  178. <a
  179. href="#press"
  180. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  181. >press</a
  182. >
  183. <a
  184. href="#contact"
  185. class="block py-2 text-sm font-medium hover:text-primary transition-smooth"
  186. >contact</a
  187. >
  188. </div>
  189. </div>
  190. </header>
  191. <main>
  192. <!-- 英雄区域 -->
  193. <section id="home" class="pt-32 pb-20 md:pt-40 md:pb-32">
  194. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  195. <div class="text-center max-w-4xl mx-auto">
  196. <h1
  197. class="text-[clamp(2.5rem,6vw,4rem)] font-semibold leading-tight mb-6 tracking-tight"
  198. >
  199. <span class="lang-en">Redefining Commerce</span>
  200. <span class="lang-zh hidden">重新定义电商体验</span>
  201. </h1>
  202. <p
  203. class="text-[clamp(1.1rem,3vw,1.5rem)] text-gray-600 mb-10 max-w-3xl mx-auto leading-relaxed text-balance"
  204. >
  205. <span class="lang-en"
  206. >The next generation platform merging e-commerce, AI, and social
  207. connectivity.</span
  208. >
  209. <span class="lang-zh hidden"
  210. >集电商、人工智能与社交连接于一体的下一代平台。</span
  211. >
  212. </p>
  213. <div class="flex flex-col sm:flex-row justify-center gap-4">
  214. <a
  215. href="#product"
  216. class="bg-primary hover:bg-primary/90 text-white px-8 py-3 rounded-md font-medium transition-smooth"
  217. >
  218. <span class="lang-en">Explore</span>
  219. <span class="lang-zh hidden">探索平台</span>
  220. </a>
  221. <a
  222. href="#contact"
  223. class="border border-gray-300 hover:border-primary hover:text-primary px-8 py-3 rounded-md font-medium transition-smooth"
  224. >
  225. <span class="lang-en">Contact Us</span>
  226. <span class="lang-zh hidden">联系我们</span>
  227. </a>
  228. </div>
  229. </div>
  230. <!-- 产品图片 -->
  231. <div class="mt-16 max-w-5xl mx-auto">
  232. <div class="rounded-2xl overflow-hidden shadow-2xl">
  233. <img
  234. src="./img/banner1.png"
  235. alt="Aisoco Platform"
  236. class="w-full h-auto"
  237. />
  238. </div>
  239. </div>
  240. </div>
  241. </section>
  242. <!-- 关于我们 -->
  243. <section id="about" class="py-20 bg-light">
  244. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  245. <div class="max-w-3xl mx-auto">
  246. <h2
  247. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-8 text-center"
  248. >
  249. <span class="lang-en">About Aisoco</span>
  250. <span class="lang-zh hidden">关于Aisoco</span>
  251. </h2>
  252. <p class="text-lg text-gray-600 mb-8 leading-relaxed">
  253. <span class="lang-en"
  254. >Founded in Silicon Valley, Aisoco is revolutionizing the way
  255. people discover, share, and purchase products online through our
  256. innovative platform that seamlessly integrates e-commerce,
  257. artificial intelligence, and social features.</span
  258. >
  259. <span class="lang-zh hidden"
  260. >Aisoco诞生于硅谷,通过我们创新的平台彻底改变人们在线发现、分享和购买产品的方式,该平台无缝整合了电商、人工智能和社交功能。</span
  261. >
  262. </p>
  263. <p class="text-lg text-gray-600 mb-8 leading-relaxed">
  264. <span class="lang-en"
  265. >Our founding team brings decades of combined experience from
  266. leading tech companies including Apple, Amazon, and Google, with
  267. a shared vision to create a more intuitive and connected
  268. shopping experience.</span
  269. >
  270. <span class="lang-zh hidden"
  271. >我们的创始团队汇集了来自苹果、亚马逊和谷歌等领先科技公司的数十年经验,共同愿景是创造更直观、更互联的购物体验。</span
  272. >
  273. </p>
  274. <!-- 融资信息 -->
  275. <div class="bg-white p-6 rounded-xl border border-gray-100">
  276. <h3 class="text-xl font-semibold mb-4">
  277. <span class="lang-en">Funding</span>
  278. <span class="lang-zh hidden">融资情况</span>
  279. </h3>
  280. <p class="text-gray-600">
  281. <span class="lang-en"
  282. >Aisoco has secured $10 million in Series A funding from
  283. leading venture capital firms.</span
  284. >
  285. <span class="lang-zh hidden"
  286. >Aisoco已从领先的风险投资公司获得1000万美元的A轮融资。</span
  287. >
  288. </p>
  289. </div>
  290. </div>
  291. </div>
  292. </section>
  293. <!-- 发展历程 -->
  294. <section id="journey" class="py-20">
  295. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  296. <h2
  297. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  298. >
  299. <span class="lang-en">Our Journey</span>
  300. <span class="lang-zh hidden">发展历程</span>
  301. </h2>
  302. <div class="max-w-4xl mx-auto relative pl-16 timeline-line">
  303. <!-- 时间点1 -->
  304. <div class="mb-16 relative timeline-dot">
  305. <h3 class="text-xl font-semibold mb-2">
  306. <span class="lang-en">Founding</span>
  307. <span class="lang-zh hidden">公司成立</span>
  308. <span class="text-gray-500 ml-3">Sep 2024</span>
  309. </h3>
  310. <p class="text-gray-600 max-w-2xl">
  311. <span class="lang-en"
  312. >Aisoco is founded in Silicon Valley by former Apple, Amazon,
  313. and Google executives with a vision to transform
  314. e-commerce.</span
  315. >
  316. <span class="lang-zh hidden"
  317. >Aisoco由前苹果、亚马逊和谷歌高管在硅谷创立,愿景是改变电商行业。</span
  318. >
  319. </p>
  320. </div>
  321. <!-- 时间点2 -->
  322. <div class="mb-16 relative timeline-dot">
  323. <h3 class="text-xl font-semibold mb-2">
  324. <span class="lang-en">Seed Funding</span>
  325. <span class="lang-zh hidden">种子轮融资</span>
  326. <span class="text-gray-500 ml-3">Dec 2024</span>
  327. </h3>
  328. <p class="text-gray-600 max-w-2xl">
  329. <span class="lang-en"
  330. >Secured $1 million in seed funding to develop the core
  331. platform and expand the founding team.</span
  332. >
  333. <span class="lang-zh hidden"
  334. >获得100万美元种子轮融资,用于开发核心平台和扩大创始团队。</span
  335. >
  336. </p>
  337. </div>
  338. <!-- 时间点3 -->
  339. <div class="relative timeline-dot">
  340. <h3 class="text-xl font-semibold mb-2">
  341. <span class="lang-en">Series A Funding</span>
  342. <span class="lang-zh hidden">A轮融资</span>
  343. <span class="text-gray-500 ml-3">May 2025</span>
  344. </h3>
  345. <p class="text-gray-600 max-w-2xl">
  346. <span class="lang-en"
  347. >Closed $10 million Series A funding round led by leading
  348. venture capital firms to accelerate product development.</span
  349. >
  350. <span class="lang-zh hidden"
  351. >完成由知名风险投资公司领投的1000万美元A轮融资,加速产品开发。</span
  352. >
  353. </p>
  354. </div>
  355. </div>
  356. </div>
  357. </section>
  358. <!-- 愿景部分 -->
  359. <section id="vision" class="py-20 bg-light">
  360. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  361. <div class="max-w-4xl mx-auto">
  362. <h2
  363. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  364. >
  365. <span class="lang-en">Our Vision</span>
  366. <span class="lang-zh hidden">我们的愿景</span>
  367. </h2>
  368. <div class="grid grid-cols-1 md:grid-cols-2 gap-10">
  369. <div class="bg-white p-8 rounded-xl border border-gray-100">
  370. <div
  371. class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center text-primary mb-6"
  372. >
  373. <i class="fa fa-lightbulb-o text-2xl"></i>
  374. </div>
  375. <h3 class="text-xl font-semibold mb-4">
  376. <span class="lang-en">Transforming Commerce</span>
  377. <span class="lang-zh hidden">改变商业格局</span>
  378. </h3>
  379. <p class="text-gray-600">
  380. <span class="lang-en"
  381. >We envision a world where commerce is seamless,
  382. personalized, and social - breaking down barriers between
  383. discovery, interaction, and purchase.</span
  384. >
  385. <span class="lang-zh hidden"
  386. >我们愿景中的世界,商业是无缝、个性化和社交化的——打破发现、互动和购买之间的壁垒。</span
  387. >
  388. </p>
  389. </div>
  390. <div class="bg-white p-8 rounded-xl border border-gray-100">
  391. <div
  392. class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center text-primary mb-6"
  393. >
  394. <i class="fa fa-globe text-2xl"></i>
  395. </div>
  396. <h3 class="text-xl font-semibold mb-4">
  397. <span class="lang-en">Global Connectivity</span>
  398. <span class="lang-zh hidden">全球连接</span>
  399. </h3>
  400. <p class="text-gray-600">
  401. <span class="lang-en"
  402. >To create a borderless commerce ecosystem that connects
  403. buyers, sellers, and influencers across the globe through
  404. intelligent technology.</span
  405. >
  406. <span class="lang-zh hidden"
  407. >通过智能技术创建一个无国界的商业生态系统,连接全球的买家、卖家和影响者。</span
  408. >
  409. </p>
  410. </div>
  411. <div class="bg-white p-8 rounded-xl border border-gray-100">
  412. <div
  413. class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center text-primary mb-6"
  414. >
  415. <i class="fa fa-users text-2xl"></i>
  416. </div>
  417. <h3 class="text-xl font-semibold mb-4">
  418. <span class="lang-en">Empowering Communities</span>
  419. <span class="lang-zh hidden">赋能社区</span>
  420. </h3>
  421. <p class="text-gray-600">
  422. <span class="lang-en"
  423. >We aim to empower creators, small businesses, and consumers
  424. alike through tools that simplify commerce and foster
  425. genuine connections.</span
  426. >
  427. <span class="lang-zh hidden"
  428. >我们旨在通过简化商业并促进真正联系的工具,为创作者、小型企业和消费者赋能。</span
  429. >
  430. </p>
  431. </div>
  432. <div class="bg-white p-8 rounded-xl border border-gray-100">
  433. <div
  434. class="w-14 h-14 bg-primary/10 rounded-full flex items-center justify-center text-primary mb-6"
  435. >
  436. <i class="fa fa-rocket text-2xl"></i>
  437. </div>
  438. <h3 class="text-xl font-semibold mb-4">
  439. <span class="lang-en">AI-Powered Experience</span>
  440. <span class="lang-zh hidden">人工智能驱动的体验</span>
  441. </h3>
  442. <p class="text-gray-600">
  443. <span class="lang-en"
  444. >Leveraging the power of artificial intelligence to create
  445. intuitive, personalized shopping experiences that anticipate
  446. needs and simplify decisions.</span
  447. >
  448. <span class="lang-zh hidden"
  449. >利用人工智能的力量创造直观、个性化的购物体验,预测需求并简化决策。</span
  450. >
  451. </p>
  452. </div>
  453. </div>
  454. <div class="mt-16 text-center">
  455. <p class="text-lg text-gray-600 max-w-3xl mx-auto">
  456. <span class="lang-en"
  457. >At Aisoco, we believe the future of commerce is intelligent,
  458. social, and seamlessly integrated into our daily lives. We're
  459. building that future today.</span
  460. >
  461. <span class="lang-zh hidden"
  462. >在Aisoco,我们相信商业的未来是智能、社交化并无缝融入日常生活的。我们正在创造这样的未来。</span
  463. >
  464. </p>
  465. </div>
  466. </div>
  467. </div>
  468. </section>
  469. <!-- 产品部分 -->
  470. <section id="product" class="py-20">
  471. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  472. <h2
  473. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  474. >
  475. <span class="lang-en">The Product</span>
  476. <span class="lang-zh hidden">平台介绍</span>
  477. </h2>
  478. <div class="grid grid-cols-1 md:grid-cols-3 gap-10 max-w-5xl mx-auto">
  479. <!-- 功能1 -->
  480. <div class="text-center">
  481. <div
  482. class="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center text-primary mx-auto mb-6"
  483. >
  484. <i class="fa fa-shopping-bag text-2xl"></i>
  485. </div>
  486. <h3 class="text-xl font-semibold mb-3">
  487. <span class="lang-en">Smart Commerce</span>
  488. <span class="lang-zh hidden">智能电商</span>
  489. </h3>
  490. <p class="text-gray-600">
  491. <span class="lang-en"
  492. >A seamless shopping experience with personalized
  493. recommendations and frictionless checkout.</span
  494. >
  495. <span class="lang-zh hidden"
  496. >无缝购物体验,提供个性化推荐和流畅的结账流程。</span
  497. >
  498. </p>
  499. </div>
  500. <!-- 功能2 -->
  501. <div class="text-center">
  502. <div
  503. class="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center text-primary mx-auto mb-6"
  504. >
  505. <i class="fa fa-cogs text-2xl"></i>
  506. </div>
  507. <h3 class="text-xl font-semibold mb-3">
  508. <span class="lang-en">AI Intelligence</span>
  509. <span class="lang-zh hidden">人工智能</span>
  510. </h3>
  511. <p class="text-gray-600">
  512. <span class="lang-en"
  513. >Advanced AI that understands preferences and delivers
  514. hyper-personalized experiences.</span
  515. >
  516. <span class="lang-zh hidden"
  517. >先进的人工智能,能够理解用户偏好并提供高度个性化的体验。</span
  518. >
  519. </p>
  520. </div>
  521. <!-- 功能3 -->
  522. <div class="text-center">
  523. <div
  524. class="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center text-primary mx-auto mb-6"
  525. >
  526. <i class="fa fa-comments text-2xl"></i>
  527. </div>
  528. <h3 class="text-xl font-semibold mb-3">
  529. <span class="lang-en">Social Connectivity</span>
  530. <span class="lang-zh hidden">社交连接</span>
  531. </h3>
  532. <p class="text-gray-600">
  533. <span class="lang-en"
  534. >Built-in social features that allow users to share
  535. discoveries and connect around products.</span
  536. >
  537. <span class="lang-zh hidden"
  538. >内置社交功能,允许用户分享发现并围绕产品建立联系。</span
  539. >
  540. </p>
  541. </div>
  542. </div>
  543. <!-- 产品展示 -->
  544. <div class="mt-20 max-w-6xl mx-auto">
  545. <img
  546. src="./img/20250901-171805.jpg"
  547. alt="Aisoco Platform Interface"
  548. class="w-full h-auto rounded-2xl shadow-xl"
  549. />
  550. <!-- App下载按钮 -->
  551. <div class="mt-16 flex flex-col sm:flex-row justify-center items-center gap-8 sm:gap-20">
  552. <!-- Android下载按钮 -->
  553. <a
  554. id="android-download-btn"
  555. href="javascript:void(0);"
  556. class="download-btn flex items-center bg-black text-white px-7 py-3.5 rounded-lg font-medium transition-all shadow-lg min-w-[200px] opacity-50 cursor-not-allowed"
  557. target="_blank"
  558. rel="noopener noreferrer"
  559. >
  560. <i class="fa fa-android text-3xl mr-3 text-green-400"></i>
  561. <div class="text-left">
  562. <div class="text-xs text-gray-300 uppercase tracking-wide">GET IT ON</div>
  563. <div class="text-base font-semibold">Google Play</div>
  564. </div>
  565. </a>
  566. <!-- iOS下载按钮 -->
  567. <a
  568. id="ios-download-btn"
  569. href="javascript:void(0);"
  570. class="download-btn flex items-center bg-black text-white px-7 py-3.5 rounded-lg font-medium transition-all shadow-lg min-w-[200px] opacity-50 cursor-not-allowed"
  571. target="_blank"
  572. rel="noopener noreferrer"
  573. >
  574. <i class="fa fa-apple text-3xl mr-3"></i>
  575. <div class="text-left">
  576. <div class="text-xs text-gray-300 uppercase tracking-wide">Download on the</div>
  577. <div class="text-base font-semibold">App Store</div>
  578. </div>
  579. </a>
  580. </div>
  581. </div>
  582. </div>
  583. </section>
  584. <!-- 团队部分 -->
  585. <section id="team" class="py-20 bg-light">
  586. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  587. <h2
  588. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  589. >
  590. <span class="lang-en">Our Team</span>
  591. <span class="lang-zh hidden">我们的团队</span>
  592. </h2>
  593. <div
  594. class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8 max-w-5xl mx-auto"
  595. >
  596. <!-- 团队成员1 -->
  597. <div class="text-center">
  598. <div class="w-40 h-40 rounded-full overflow-hidden mx-auto mb-4">
  599. <img
  600. src="./img/20250901-171822.jpg"
  601. alt="Team Member"
  602. class="w-full h-full object-cover"
  603. />
  604. </div>
  605. <h3 class="text-lg font-semibold">Sarah Johnson</h3>
  606. <p class="text-primary text-sm mb-1">CEO & Founder</p>
  607. <p class="text-gray-500 text-sm">
  608. <span class="lang-en">Ex-Apple</span>
  609. <span class="lang-zh hidden">前苹果公司</span>
  610. </p>
  611. </div>
  612. <!-- 团队成员2 -->
  613. <div class="text-center">
  614. <div class="w-40 h-40 rounded-full overflow-hidden mx-auto mb-4">
  615. <img
  616. src="./img/20250901-171825.jpg"
  617. alt="Team Member"
  618. class="w-full h-full object-cover"
  619. />
  620. </div>
  621. <h3 class="text-lg font-semibold">Michael Chen</h3>
  622. <p class="text-primary text-sm mb-1">CTO</p>
  623. <p class="text-gray-500 text-sm">
  624. <span class="lang-en">Former Amazon</span>
  625. <span class="lang-zh hidden">前亚马逊</span>
  626. </p>
  627. </div>
  628. <!-- 团队成员3 -->
  629. <div class="text-center">
  630. <div class="w-40 h-40 rounded-full overflow-hidden mx-auto mb-4">
  631. <img
  632. src="./img/20250901-171829.jpg"
  633. alt="Team Member"
  634. class="w-full h-full object-cover"
  635. />
  636. </div>
  637. <h3 class="text-lg font-semibold">David Rodriguez</h3>
  638. <p class="text-primary text-sm mb-1">AI Director</p>
  639. <p class="text-gray-500 text-sm">
  640. <span class="lang-en">Ex-Google</span>
  641. <span class="lang-zh hidden">前谷歌</span>
  642. </p>
  643. </div>
  644. <!-- 团队成员4 -->
  645. <div class="text-center">
  646. <div class="w-40 h-40 rounded-full overflow-hidden mx-auto mb-4">
  647. <img
  648. src="./img/20250901-171832.jpg"
  649. alt="Team Member"
  650. class="w-full h-full object-cover"
  651. />
  652. </div>
  653. <h3 class="text-lg font-semibold">Jessica Park</h3>
  654. <p class="text-primary text-sm mb-1">Product Lead</p>
  655. <p class="text-gray-500 text-sm">
  656. <span class="lang-en">Apple & Amazon</span>
  657. <span class="lang-zh hidden">苹果和亚马逊</span>
  658. </p>
  659. </div>
  660. </div>
  661. </div>
  662. </section>
  663. <!-- 新闻部分 -->
  664. <section id="press" class="py-20">
  665. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  666. <h2
  667. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  668. >
  669. <span class="lang-en">In The News</span>
  670. <span class="lang-zh hidden">新闻报道</span>
  671. </h2>
  672. <div class="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-5xl mx-auto">
  673. <!-- 新闻1 -->
  674. <div
  675. class="border border-gray-200 rounded-xl p-6 hover:shadow-md transition-smooth"
  676. >
  677. <div class="flex items-center mb-4">
  678. <img
  679. src="https://picsum.photos/id/119/80/80"
  680. alt="Tech Media Logo"
  681. class="w-12 h-12 object-contain"
  682. />
  683. <span class="text-gray-500 text-sm ml-3">June 15, 2025</span>
  684. </div>
  685. <h3 class="text-lg font-semibold mb-2">
  686. <span class="lang-en"
  687. >Aisoco Secures $10M in Series A Funding</span
  688. >
  689. <span class="lang-zh hidden">Aisoco获得1000万美元A轮融资</span>
  690. </h3>
  691. <p class="text-gray-600 text-sm">
  692. <span class="lang-en"
  693. >Silicon Valley startup combining AI, social, and e-commerce
  694. raises significant funding.</span
  695. >
  696. <span class="lang-zh hidden"
  697. >这家结合人工智能、社交和电商的硅谷初创公司获得巨额融资。</span
  698. >
  699. </p>
  700. </div>
  701. <!-- 新闻2 -->
  702. <div
  703. class="border border-gray-200 rounded-xl p-6 hover:shadow-md transition-smooth"
  704. >
  705. <div class="flex items-center mb-4">
  706. <img
  707. src="https://picsum.photos/id/129/80/80"
  708. alt="Tech Media Logo"
  709. class="w-12 h-12 object-contain"
  710. />
  711. <span class="text-gray-500 text-sm ml-3">May 2, 2025</span>
  712. </div>
  713. <h3 class="text-lg font-semibold mb-2">
  714. <span class="lang-en">Reinventing E-Commerce Experience</span>
  715. <span class="lang-zh hidden">重塑电商体验</span>
  716. </h3>
  717. <p class="text-gray-600 text-sm">
  718. <span class="lang-en"
  719. >Former Apple and Google executives launch innovative new
  720. platform.</span
  721. >
  722. <span class="lang-zh hidden"
  723. >前苹果和谷歌高管推出创新新平台。</span
  724. >
  725. </p>
  726. </div>
  727. <!-- 新闻3 -->
  728. <div
  729. class="border border-gray-200 rounded-xl p-6 hover:shadow-md transition-smooth"
  730. >
  731. <div class="flex items-center mb-4">
  732. <img
  733. src="https://picsum.photos/id/139/80/80"
  734. alt="Tech Media Logo"
  735. class="w-12 h-12 object-contain"
  736. />
  737. <span class="text-gray-500 text-sm ml-3">April 18, 2025</span>
  738. </div>
  739. <h3 class="text-lg font-semibold mb-2">
  740. <span class="lang-en">The Future of Social Shopping</span>
  741. <span class="lang-zh hidden">社交购物的未来</span>
  742. </h3>
  743. <p class="text-gray-600 text-sm">
  744. <span class="lang-en"
  745. >How Aisoco is merging AI with social features to change
  746. online retail.</span
  747. >
  748. <span class="lang-zh hidden"
  749. >Aisoco如何将人工智能与社交功能融合,改变在线零售。</span
  750. >
  751. </p>
  752. </div>
  753. </div>
  754. </div>
  755. </section>
  756. <!-- 联系部分 -->
  757. <section id="contact" class="py-20 bg-light">
  758. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  759. <h2
  760. class="text-[clamp(1.8rem,4vw,2.5rem)] font-semibold mb-16 text-center"
  761. >
  762. <span class="lang-en">Get In Touch</span>
  763. <span class="lang-zh hidden">联系我们</span>
  764. </h2>
  765. <div class="max-w-4xl mx-auto">
  766. <div class="grid grid-cols-1 lg:grid-cols-2 gap-10">
  767. <!-- 联系表单 -->
  768. <div>
  769. <form
  770. id="contact-form"
  771. class="bg-white p-8 rounded-xl border border-gray-100"
  772. >
  773. <h3 class="text-xl font-semibold mb-6">
  774. <span class="lang-en">Send us a message</span>
  775. <span class="lang-zh hidden">给我们留言</span>
  776. </h3>
  777. <div class="mb-5">
  778. <label
  779. for="name"
  780. class="block text-gray-700 text-sm font-medium mb-2"
  781. >
  782. <span class="lang-en">Name</span>
  783. <span class="lang-zh hidden">姓名</span>
  784. </label>
  785. <input
  786. type="text"
  787. id="name"
  788. name="name"
  789. class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-smooth"
  790. required
  791. />
  792. </div>
  793. <div class="mb-5">
  794. <label
  795. for="email"
  796. class="block text-gray-700 text-sm font-medium mb-2"
  797. >
  798. <span class="lang-en">Email</span>
  799. <span class="lang-zh hidden">邮箱</span>
  800. </label>
  801. <input
  802. type="email"
  803. id="email"
  804. name="email"
  805. class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-smooth"
  806. required
  807. />
  808. </div>
  809. <div class="mb-6">
  810. <label
  811. for="message"
  812. class="block text-gray-700 text-sm font-medium mb-2"
  813. >
  814. <span class="lang-en">Message</span>
  815. <span class="lang-zh hidden">留言</span>
  816. </label>
  817. <textarea
  818. id="message"
  819. name="message"
  820. rows="4"
  821. class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-smooth resize-none"
  822. required
  823. ></textarea>
  824. </div>
  825. <button
  826. type="submit"
  827. class="w-full bg-primary hover:bg-primary/90 text-white px-6 py-3 rounded-md font-medium transition-smooth"
  828. >
  829. <span class="lang-en">Send Message</span>
  830. <span class="lang-zh hidden">发送留言</span>
  831. </button>
  832. </form>
  833. </div>
  834. <!-- 联系信息 -->
  835. <div>
  836. <div
  837. class="bg-white p-8 rounded-xl border border-gray-100 h-full"
  838. >
  839. <h3 class="text-xl font-semibold mb-6">
  840. <span class="lang-en">Contact Information</span>
  841. <span class="lang-zh hidden">联系信息</span>
  842. </h3>
  843. <div class="space-y-6">
  844. <div>
  845. <h4 class="text-sm font-medium text-gray-500 mb-1">
  846. <span class="lang-en">Office</span>
  847. <span class="lang-zh hidden">办公室</span>
  848. </h4>
  849. <p class="text-gray-700">
  850. <span class="lang-en"
  851. >123 Innovation Way, San Francisco, CA 94107</span
  852. >
  853. <span class="lang-zh hidden"
  854. >旧金山创新路123号,CA 94107</span
  855. >
  856. </p>
  857. </div>
  858. <!-- <div>
  859. <h4 class="text-sm font-medium text-gray-500 mb-1">
  860. <span class="lang-en">Phone</span>
  861. <span class="lang-zh hidden">电话</span>
  862. </h4>
  863. <p class="text-gray-700">+1 (555) 123-4567</p>
  864. </div> -->
  865. <div>
  866. <h4 class="text-sm font-medium text-gray-500 mb-1">
  867. <span class="lang-en">Email</span>
  868. <span class="lang-zh hidden">邮箱</span>
  869. </h4>
  870. <p class="text-gray-700">support@aisoco.net</p>
  871. </div>
  872. </div>
  873. <div class="mt-10">
  874. <h4 class="text-sm font-medium text-gray-500 mb-4">
  875. <span class="lang-en">Follow Us</span>
  876. <span class="lang-zh hidden">关注我们</span>
  877. </h4>
  878. <div class="flex space-x-4">
  879. <a
  880. href="#"
  881. class="w-10 h-10 rounded-full bg-gray-100 hover:bg-primary hover:text-white flex items-center justify-center text-gray-600 transition-smooth"
  882. >
  883. <i class="fa fa-twitter"></i>
  884. </a>
  885. <a
  886. href="#"
  887. class="w-10 h-10 rounded-full bg-gray-100 hover:bg-primary hover:text-white flex items-center justify-center text-gray-600 transition-smooth"
  888. >
  889. <i class="fa fa-linkedin"></i>
  890. </a>
  891. <a
  892. href="#"
  893. class="w-10 h-10 rounded-full bg-gray-100 hover:bg-primary hover:text-white flex items-center justify-center text-gray-600 transition-smooth"
  894. >
  895. <i class="fa fa-instagram"></i>
  896. </a>
  897. </div>
  898. </div>
  899. </div>
  900. </div>
  901. </div>
  902. </div>
  903. </div>
  904. </section>
  905. </main>
  906. <!-- 页脚 -->
  907. <footer class="bg-dark text-white py-12">
  908. <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  909. <div class="max-w-6xl mx-auto">
  910. <div
  911. class="flex flex-col md:flex-row justify-between items-center mb-8"
  912. >
  913. <a href="#home" class="text-2xl font-semibold mb-6 md:mb-0"
  914. >Aisoco</a
  915. >
  916. <div class="flex flex-wrap justify-center gap-x-8 gap-y-4">
  917. <a
  918. href="#about"
  919. class="text-gray-400 hover:text-white text-sm transition-smooth"
  920. >
  921. <span class="lang-en">About</span>
  922. <span class="lang-zh hidden">关于我们</span>
  923. </a>
  924. <a
  925. href="#journey"
  926. class="text-gray-400 hover:text-white text-sm transition-smooth"
  927. >
  928. <span class="lang-en">Journey</span>
  929. <span class="lang-zh hidden">发展历程</span>
  930. </a>
  931. <a
  932. href="#vision"
  933. class="text-gray-400 hover:text-white text-sm transition-smooth"
  934. >
  935. <span class="lang-en">Vision</span>
  936. <span class="lang-zh hidden">愿景</span>
  937. </a>
  938. <a
  939. href="#product"
  940. class="text-gray-400 hover:text-white text-sm transition-smooth"
  941. >
  942. <span class="lang-en">Product</span>
  943. <span class="lang-zh hidden">产品</span>
  944. </a>
  945. <a
  946. href="#team"
  947. class="text-gray-400 hover:text-white text-sm transition-smooth"
  948. >
  949. <span class="lang-en">Team</span>
  950. <span class="lang-zh hidden">团队</span>
  951. </a>
  952. <a
  953. href="#press"
  954. class="text-gray-400 hover:text-white text-sm transition-smooth"
  955. >
  956. <span class="lang-en">Press</span>
  957. <span class="lang-zh hidden">新闻</span>
  958. </a>
  959. <a
  960. href="#contact"
  961. class="text-gray-400 hover:text-white text-sm transition-smooth"
  962. >
  963. <span class="lang-en">Contact</span>
  964. <span class="lang-zh hidden">联系</span>
  965. </a>
  966. </div>
  967. </div>
  968. <div
  969. class="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center"
  970. >
  971. <p class="text-gray-500 text-sm mb-4 md:mb-0">
  972. &copy; 2025 Aisoco, Inc. All rights reserved.
  973. </p>
  974. <div class="flex space-x-6">
  975. <a href="./terms.html" target="_blank" class="text-gray-500 hover:text-gray-300 text-sm">
  976. <span class="lang-en">Terms of Service</span>
  977. <span class="lang-zh hidden">服务条款</span>
  978. </a>
  979. <a href="./privacy.html" target="_blank" class="text-gray-500 hover:text-gray-300 text-sm">
  980. <span class="lang-en">Privacy Policy</span>
  981. <span class="lang-zh hidden">隐私政策</span>
  982. </a>
  983. <a href="./refund.html" target="_blank" class="text-gray-500 hover:text-gray-300 text-sm">
  984. <span class="lang-en">Return & Refund Policy</span>
  985. <span class="lang-zh hidden">退货退款政策</span>
  986. </a>
  987. </div>
  988. </div>
  989. </div>
  990. </div>
  991. </footer>
  992. <!-- 返回顶部按钮 -->
  993. <button
  994. id="back-to-top"
  995. class="fixed bottom-8 right-8 w-12 h-12 rounded-full bg-dark text-white shadow-lg flex items-center justify-center opacity-0 invisible transition-all z-50"
  996. >
  997. <i class="fa fa-chevron-up"></i>
  998. </button>
  999. <!-- JavaScript -->
  1000. <script>
  1001. // 语言切换功能
  1002. const langEnBtn = document.getElementById('lang-en');
  1003. const langZhBtn = document.getElementById('lang-zh');
  1004. const langEnElements = document.querySelectorAll('.lang-en');
  1005. const langZhElements = document.querySelectorAll('.lang-zh');
  1006. langEnBtn.addEventListener('click', function () {
  1007. langEnBtn.classList.add('text-primary');
  1008. langEnBtn.classList.remove('text-gray-500');
  1009. langZhBtn.classList.add('text-gray-500');
  1010. langZhBtn.classList.remove('text-primary');
  1011. langEnElements.forEach((el) => el.classList.remove('hidden'));
  1012. langZhElements.forEach((el) => el.classList.add('hidden'));
  1013. });
  1014. langZhBtn.addEventListener('click', function () {
  1015. langZhBtn.classList.add('text-primary');
  1016. langZhBtn.classList.remove('text-gray-500');
  1017. langEnBtn.classList.add('text-gray-500');
  1018. langEnBtn.classList.remove('text-primary');
  1019. langZhElements.forEach((el) => el.classList.remove('hidden'));
  1020. langEnElements.forEach((el) => el.classList.add('hidden'));
  1021. });
  1022. // 导航栏滚动效果
  1023. const navbar = document.getElementById('navbar');
  1024. const backToTop = document.getElementById('back-to-top');
  1025. window.addEventListener('scroll', function () {
  1026. if (window.scrollY > 100) {
  1027. navbar.classList.add(
  1028. 'bg-white/90',
  1029. 'backdrop-blur-sm',
  1030. 'shadow-sm',
  1031. 'py-3'
  1032. );
  1033. navbar.classList.remove('py-6');
  1034. backToTop.classList.remove('opacity-0', 'invisible');
  1035. backToTop.classList.add('opacity-100', 'visible');
  1036. } else {
  1037. navbar.classList.remove(
  1038. 'bg-white/90',
  1039. 'backdrop-blur-sm',
  1040. 'shadow-sm',
  1041. 'py-3'
  1042. );
  1043. navbar.classList.add('py-6');
  1044. backToTop.classList.add('opacity-0', 'invisible');
  1045. backToTop.classList.remove('opacity-100', 'visible');
  1046. }
  1047. });
  1048. // 移动端菜单切换
  1049. const menuToggle = document.getElementById('menu-toggle');
  1050. const mobileMenu = document.getElementById('mobile-menu');
  1051. menuToggle.addEventListener('click', function () {
  1052. mobileMenu.classList.toggle('hidden');
  1053. const icon = menuToggle.querySelector('i');
  1054. if (icon.classList.contains('fa-bars')) {
  1055. icon.classList.remove('fa-bars');
  1056. icon.classList.add('fa-times');
  1057. } else {
  1058. icon.classList.remove('fa-times');
  1059. icon.classList.add('fa-bars');
  1060. }
  1061. });
  1062. // 平滑滚动
  1063. document.querySelectorAll('a[href^="#"]').forEach((anchor) => {
  1064. anchor.addEventListener('click', function (e) {
  1065. const href = this.getAttribute('href');
  1066. // 跳过下载按钮和其他非锚点链接
  1067. if (!href || href === '#' || href === 'javascript:void(0);' || !href.startsWith('#')) {
  1068. return;
  1069. }
  1070. e.preventDefault();
  1071. // 关闭移动菜单
  1072. if (!mobileMenu.classList.contains('hidden')) {
  1073. mobileMenu.classList.add('hidden');
  1074. const icon = menuToggle.querySelector('i');
  1075. icon.classList.remove('fa-times');
  1076. icon.classList.add('fa-bars');
  1077. }
  1078. const targetElement = document.querySelector(href);
  1079. if (targetElement) {
  1080. window.scrollTo({
  1081. top: targetElement.offsetTop - 80,
  1082. behavior: 'smooth',
  1083. });
  1084. }
  1085. });
  1086. });
  1087. // 返回顶部功能
  1088. backToTop.addEventListener('click', function () {
  1089. window.scrollTo({
  1090. top: 0,
  1091. behavior: 'smooth',
  1092. });
  1093. });
  1094. // 表单提交处理
  1095. const contactForm = document.getElementById('contact-form');
  1096. if (contactForm) {
  1097. contactForm.addEventListener('submit', function (e) {
  1098. e.preventDefault();
  1099. // 模拟表单提交
  1100. const submitBtn = this.querySelector('button[type="submit"]');
  1101. const originalText = submitBtn.innerHTML;
  1102. submitBtn.disabled = true;
  1103. submitBtn.innerHTML =
  1104. '<i class="fa fa-spinner fa-spin mr-2"></i> <span class="lang-en">Sending...</span><span class="lang-zh hidden">发送中...</span>';
  1105. setTimeout(() => {
  1106. alert('Thank you for your message! We will get back to you soon.');
  1107. this.reset();
  1108. submitBtn.disabled = false;
  1109. submitBtn.innerHTML = originalText;
  1110. }, 1500);
  1111. });
  1112. }
  1113. // App下载链接获取功能
  1114. async function fetchDownloadUrl(type) {
  1115. try {
  1116. const response = await fetch(`https://ht.banhubuy.com/operating/config/getUrlByType?type=${type}`);
  1117. const data = await response.json();
  1118. if (data.code === "200" && data.data && data.data.valueInfo) {
  1119. return data.data.valueInfo;
  1120. }
  1121. return null;
  1122. } catch (error) {
  1123. console.error('Failed to fetch download URL:', error);
  1124. return null;
  1125. }
  1126. }
  1127. // 初始化下载按钮
  1128. async function initDownloadButtons() {
  1129. const androidBtn = document.getElementById('android-download-btn');
  1130. const iosBtn = document.getElementById('ios-download-btn');
  1131. // 初始状态:禁用按钮,防止在加载时点击
  1132. androidBtn.style.pointerEvents = 'none';
  1133. iosBtn.style.pointerEvents = 'none';
  1134. // 获取Android下载链接
  1135. const androidUrl = await fetchDownloadUrl(1);
  1136. if (androidUrl) {
  1137. // 有下载链接:启用按钮
  1138. androidBtn.onclick = function(e) {
  1139. e.preventDefault();
  1140. window.open(androidUrl, '_blank');
  1141. };
  1142. androidBtn.classList.remove('opacity-50', 'cursor-not-allowed');
  1143. androidBtn.classList.add('hover:bg-gray-800', 'hover:shadow-xl', 'cursor-pointer');
  1144. androidBtn.style.opacity = '1';
  1145. androidBtn.style.pointerEvents = 'auto';
  1146. } else {
  1147. // 无下载链接:保持禁用状态
  1148. androidBtn.style.opacity = '0.4';
  1149. androidBtn.style.pointerEvents = 'none';
  1150. }
  1151. // 获取iOS下载链接
  1152. const iosUrl = await fetchDownloadUrl(2);
  1153. if (iosUrl) {
  1154. // 有下载链接:启用按钮
  1155. iosBtn.onclick = function(e) {
  1156. e.preventDefault();
  1157. window.open(iosUrl, '_blank');
  1158. };
  1159. iosBtn.classList.remove('opacity-50', 'cursor-not-allowed');
  1160. iosBtn.classList.add('hover:bg-gray-800', 'hover:shadow-xl', 'cursor-pointer');
  1161. iosBtn.style.opacity = '1';
  1162. iosBtn.style.pointerEvents = 'auto';
  1163. } else {
  1164. // 无下载链接:保持禁用状态
  1165. iosBtn.style.opacity = '0.4';
  1166. iosBtn.style.pointerEvents = 'none';
  1167. }
  1168. }
  1169. // 页面加载完成后初始化下载按钮
  1170. document.addEventListener('DOMContentLoaded', function() {
  1171. initDownloadButtons();
  1172. });
  1173. </script>
  1174. </body>
  1175. </html>