{"id":277,"date":"2025-06-24T14:24:05","date_gmt":"2025-06-24T06:24:05","guid":{"rendered":"https:\/\/www.marsixlab.com\/?page_id=277"},"modified":"2026-03-27T13:12:52","modified_gmt":"2026-03-27T05:12:52","slug":"%e9%9f%b3%e4%b9%90%e5%b1%95%e7%a4%ba","status":"publish","type":"page","link":"https:\/\/www.marsixlab.com\/index.php\/zh\/%e9%9f%b3%e4%b9%90%e5%b1%95%e7%a4%ba\/","title":{"rendered":"\u97f3\u4e50\u5c55\u793a"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"277\" class=\"elementor elementor-277\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ddc6338 e-flex e-con-boxed e-con e-parent\" data-id=\"ddc6338\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-982fbca elementor-widget elementor-widget-heading\" data-id=\"982fbca\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Marsix \u306e\u97f3\u4e50\u4e13\u8f91<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a81cccd elementor-widget elementor-widget-html\" data-id=\"a81cccd\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n\/* \u5e03\u5c40 *\/\r\n.album-grid {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  justify-content: center;\r\n  gap: 28px;\r\n  padding: 40px;\r\n}\r\n\r\n\/* \u5361\u7247\u9ed8\u8ba4\uff1a\u900f\u660e\u3001\u9759\u6b62 *\/\r\n.album-card {\r\n  width: 200px;\r\n  border-radius: 16px;\r\n  background: transparent;\r\n  cursor: pointer;\r\n  position: relative;\r\n  transition: transform 0.45s cubic-bezier(.2,.9,.2,1), box-shadow 0.35s;\r\n  transform: translateY(0);\r\n}\r\n\r\n\/* \u6fc0\u6d3b\u5361\u7247\uff1a\u4e0a\u6d6e + \u78e8\u7802\u73bb\u7483\u80cc\u666f *\/\r\n.album-card.active {\r\n  transform: translateY(-40px) scale(1.03);\r\n  background: rgba(255,255,255,0.12);\r\n  backdrop-filter: blur(10px);\r\n  box-shadow: 0 16px 36px rgba(0,0,0,0.36);\r\n  z-index: 30;\r\n}\r\n\r\n\/* \u5c01\u9762\u5916\u58f3\u4e0e\u56fe\u7247 *\/\r\n.album-cover {\r\n  width: 100%;\r\n  height: 200px;\r\n  border-radius: 12px;\r\n  overflow: hidden;\r\n  display: block;\r\n  will-change: transform;\r\n  transform-origin: 50% 50%;\r\n  transition: transform 0.45s ease; \/* \u9002\u7528\u4e8e\u7f29\u653e\u7b49 *\/\r\n}\r\n\r\n.album-cover img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  display: block;\r\n  backface-visibility: hidden;\r\n}\r\n\r\n\/* \u7528\u4e8e\u6307\u793a\u6b63\u5728\u65cb\u8f6c\u7684\u7c7b\uff08\u56de\u9000\u6837\u5f0f\uff0c\u4ec5\u5728\u6ca1\u6709 WA API \u65f6\u53ef\u89c1\uff09*\/\r\n.album-cover.rotating-fallback {\r\n  animation: spin-fallback 5s linear infinite;\r\n}\r\n\r\n@keyframes spin-fallback {\r\n  from { transform: rotate(0deg); }\r\n  to   { transform: rotate(360deg); }\r\n}\r\n\r\n\/* \u6b4c\u66f2\u4fe1\u606f\u533a\u57df\uff08\u9690\u85cf\/\u5c55\u5f00\uff09*\/\r\n.album-info {\r\n  max-height: 0;\r\n  overflow: hidden;\r\n  transition: max-height 0.45s ease, padding 0.35s ease, opacity 0.35s;\r\n  padding: 0 16px;\r\n  opacity: 0;\r\n}\r\n\r\n.album-card.active .album-info {\r\n  max-height: 260px;\r\n  padding-top: 14px;\r\n  padding-bottom: 14px;\r\n  opacity: 1;\r\n}\r\n\r\n.album-info ul {\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  color: #fff;\r\n  font-size: 14px;\r\n}\r\n\r\n.album-info li {\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:space-between;\r\n  padding:8px 0;\r\n  border-bottom: 1px solid rgba(255,255,255,0.10);\r\n}\r\n\r\n\/* \u64ad\u653e\u6309\u94ae *\/\r\n.play-btn {\r\n  background: rgba(255,255,255,0.14);\r\n  border: none;\r\n  width: 34px;\r\n  height: 34px;\r\n  border-radius: 50%;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  cursor:pointer;\r\n  transition: background 0.18s;\r\n  color: #fff;\r\n  font-weight: 600;\r\n}\r\n.play-btn:hover { background: rgba(255,255,255,0.28); }\r\n.play-btn i { pointer-events: none; font-style: normal; }\r\n\r\n\/* \u8f7b\u5fae\u56fe\u7247\u7f29\u653e\uff08\u6fc0\u6d3b\u65f6\uff09 *\/\r\n.album-card.active .album-cover {\r\n  transform: scale(1.02);\r\n}\r\n\r\n\/* \u5c0f\u5c4f\u9002\u914d *\/\r\n@media (max-width: 760px) {\r\n  .album-card { width: 90%; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"album-grid\">\r\n  <!-- album 1 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f,Aouse - Ascendance.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/001.png\" alt=\"\u5c01\u9762A\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>Ascendance <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f,Aouse - Ascendance.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- album 2 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Yi.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/002-1.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>Yi <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Yi.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- album 3 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Taoist rhyme.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/003.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>Taoist rhyme <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Taoist rhyme.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- album 4 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 01.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/004.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>Pipa Spa 01 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 01.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>Pipa Spa 02 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 02 (1).mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>Pipa Spa 03 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 03 (1).mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>Pipa Spa 04 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 04 (1).mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>Pipa Spa 05 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 05.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>Pipa Spa 06 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/pipa spa\/MARSIX\u5218\u5bb6\u826f - Pipa Spa 06.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- album 5 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u5999\u77ac.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/005.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>\u5999\u77ac <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u5999\u77ac.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u5bd2\u9165 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u5bd2\u9165.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u66ae\u4e91 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u66ae\u4e91.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u671b\u8212 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u671b\u8212.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u6f84\u5ed3 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u6f84\u5ed3.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u78a7\u843d <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u67d4\u7947\/MARSIX\u5218\u5bb6\u826f - \u78a7\u843d.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- album 6 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Serendipity.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/006.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>Serendipity <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/MARSIX\u5218\u5bb6\u826f - Serendipity.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n  <!-- album 7 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u5c42\u5c9a.mp3\">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/007.png\" alt=\"\u5c01\u9762B\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>\u5c42\u5c9a <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u5c42\u5c9a.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u65f6\u6da7 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u65f6\u6da7.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u6de1\u5a25 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u6de1\u5a25.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u6f7a\u6e72 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u6f7a\u6e72.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u8212\u5f90 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u8212\u5f90.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u9ca4\u7d20 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u5999\u67d3\/MARSIX\u5218\u5bb6\u826f - \u9ca4\u7d20.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- album 8 -->\r\n  <div class=\"album-card\" data-first=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u5f26\u6f84.mp3 \">\r\n    <div class=\"album-cover\">\r\n      <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/008.png\" alt=\"\u5c01\u9762C\">\r\n    <\/div>\r\n    <div class=\"album-info\">\r\n      <ul>\r\n        <li>\u5f26\u6f84 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u5f26\u6f84.mp3 \"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u6e05\u6d9f <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u6e05\u6d9f.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u753b\u4e91 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u753b\u4e91.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u7eb1\u7fe0 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u7eb1\u7fe0.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n        <li>\u955c\u9690 <button class=\"play-btn\" data-src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/marsix\/\u6e05\u610f\/MARSIX\u5218\u5bb6\u826f - \u955c\u9690.mp3\"><i>\u25b6<\/i><\/button><\/li>\r\n      <\/ul>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n\/*\r\n \u529f\u80fd\uff1a\r\n - \u70b9\u51fb\u5361\u7247\uff1a\u5c55\u5f00\u8be5\u4e13\u8f91\uff08\u5176\u4ed6\u5173\u95ed\uff09\uff0c\u5e73\u6ed1\u542f\u52a8\u5c01\u9762\u65cb\u8f6c\uff082D\uff09\uff0c\u5e76\u81ea\u52a8\u64ad\u653e\u8be5\u4e13\u8f91\u7684\u7b2c\u4e00\u9996\uff08data-first\uff09\u3002\r\n - \u5207\u6362\u4e13\u8f91\uff1a\u4e0a\u4e00\u4e2a\u4e13\u8f91\u7684\u65cb\u8f6c\u5c06\u5728 400ms \u5185\u5e73\u6ed1\u505c\u6b62\uff0c\u97f3\u9891\u505c\u6b62\u3002\r\n - \u64ad\u653e\u6309\u94ae\uff1a\u70b9\u51fb\u5355\u66f2\u64ad\u653e\/\u6682\u505c\uff08\u4e0d\u89e6\u53d1\u5361\u7247\u5207\u6362\uff09\u3002\r\n - \u5982\u679c\u4e0d\u652f\u6301 Web Animations API\uff0c\u4f1a\u56de\u9000\u5230 CSS \u52a8\u753b\u7c7b\u540d 'rotating-fallback'\uff08\u65e0\u5e73\u6ed1 ramp\uff09\u3002\r\n*\/\r\n\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n  const cards = Array.from(document.querySelectorAll('.album-card'));\r\n  const audio = new Audio();\r\n  let currentCard = null;        \/\/ \u5f53\u524d\u88ab\u9009\u4e2d\u7684\u5361\u7247 DOM\r\n  let currentPlayingBtn = null;  \/\/ \u5f53\u524d\u5355\u66f2\u64ad\u653e\u6309\u94ae DOM\r\n  const rampMs = 400;            \/\/ \u5e73\u6ed1 ramp \u65f6\u957f\uff08\u6beb\u79d2\uff09\r\n  const supportsWA = typeof Element.prototype.animate === 'function';\r\n\r\n  \/\/ \u8bb0\u5f55\u6bcf\u4e2a\u5361\u7247\u7684 rotation Animation\uff08Web Animations\uff09\u5bf9\u8c61\uff08\u82e5\u652f\u6301\uff09\r\n  const animations = new Map();\r\n\r\n  \/\/ \u521b\u5efa\u4f46\u4e0d\u542f\u52a8\u52a8\u753b\uff08\u82e5\u652f\u6301\uff09\r\n  cards.forEach(card => {\r\n    const cover = card.querySelector('.album-cover');\r\n    if (supportsWA) {\r\n      try {\r\n        const img = cover.querySelector('img');\r\n        \/\/ \u521b\u5efa\u4e00\u4e2a\u65e0\u9650\u65cb\u8f6c\u52a8\u753b\uff0c\u4f46\u5148\u6682\u505c\u5e76\u8bbe\u7f6e playbackRate = 0\r\n        const anim = img.animate(\r\n          [{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }],\r\n          { duration: 5000, iterations: Infinity, easing: 'linear' }\r\n        );\r\n        anim.pause();\r\n        anim.playbackRate = 0; \/\/ \u4ece 0 \u5f00\u59cb\r\n        animations.set(card, anim);\r\n      } catch (err) {\r\n        \/\/ \u5982\u5931\u8d25\u5219 fallback\r\n        cover.classList.add('rotating-fallback');\r\n      }\r\n    } else {\r\n      \/\/ \u56de\u9000\uff1a\u7528 CSS \u7c7b\u63a7\u5236\uff08\u65e0 ramp\uff09\r\n      cover.classList.remove('rotating-fallback');\r\n    }\r\n  });\r\n\r\n  \/\/ \u5e73\u6ed1\u63d0\u5347 playbackRate \u5230\u76ee\u6807\u503c\uff080 -> 1\uff09\r\n  function rampPlay(anim, targetRate = 1, duration = rampMs) {\r\n    if (!anim) return;\r\n    const start = performance.now();\r\n    const initial = anim.playbackRate || 0;\r\n    const delta = targetRate - initial;\r\n    anim.play(); \/\/ ensure playing so playbackRate has effect\r\n    function step(now) {\r\n      const t = Math.min(1, (now - start) \/ duration);\r\n      anim.playbackRate = initial + delta * t;\r\n      if (t < 1) requestAnimationFrame(step);\r\n    }\r\n    requestAnimationFrame(step);\r\n  }\r\n\r\n  \/\/ \u5e73\u6ed1\u964d\u4f4e playbackRate \u5230 0 \u7136\u540e pause\r\n  function rampStop(anim, duration = rampMs) {\r\n    if (!anim) return;\r\n    const start = performance.now();\r\n    const initial = anim.playbackRate || 1;\r\n    function step(now) {\r\n      const t = Math.min(1, (now - start) \/ duration);\r\n      anim.playbackRate = initial * (1 - t); \/\/ linear down to 0\r\n      if (t < 1) {\r\n        requestAnimationFrame(step);\r\n      } else {\r\n        try { anim.pause(); anim.currentTime = 0; } catch(e) { \/* ignore *\/ }\r\n      }\r\n    }\r\n    requestAnimationFrame(step);\r\n  }\r\n\r\n  \/\/ \u70b9\u51fb\u5361\u7247\u4e3b\u903b\u8f91\r\n  cards.forEach(card => {\r\n    \/\/ get first track url\r\n    const firstSrc = card.dataset.first || null;\r\n\r\n    card.addEventListener('click', (e) => {\r\n      \/\/ \u82e5\u70b9\u5728 play \u6309\u94ae\u4e0a\u5219\u4e0d\u89e6\u53d1\u5361\u7247\u5207\u6362\r\n      if (e.target.closest('.play-btn')) return;\r\n\r\n      \/\/ \u5982\u679c\u5df2\u7ecf\u662f\u6fc0\u6d3b\u5219\u6536\u8d77\uff08\u5e76\u505c\u6b62\u65cb\u8f6c\u4e0e\u97f3\u9891\uff09\r\n      if (card.classList.contains('active')) {\r\n        \/\/ stop audio if it was playing this card's first\r\n        if (currentCard === card) {\r\n          audio.pause();\r\n          audio.src = '';\r\n          currentCard = null;\r\n        }\r\n\r\n        \/\/ stop rotation smoothly\r\n        if (supportsWA && animations.has(card)) {\r\n          rampStop(animations.get(card));\r\n        } else {\r\n          card.querySelector('.album-cover').classList.remove('rotating-fallback');\r\n        }\r\n        card.classList.remove('active');\r\n        return;\r\n      }\r\n\r\n      \/\/ \u5207\u6362\uff1a\u5148\u5173\u95ed\u4e0a\u4e00\u4e2a\uff08\u82e5\u6709\uff09\r\n      if (currentCard) {\r\n        \/\/ \u505c\u6b62\u4e0a\u4e00\u4e2a\u65cb\u8f6c\uff08\u5e73\u6ed1\uff09\r\n        if (supportsWA && animations.has(currentCard)) {\r\n          rampStop(animations.get(currentCard));\r\n        } else {\r\n          currentCard.querySelector('.album-cover').classList.remove('rotating-fallback');\r\n        }\r\n        \/\/ \u505c\u6b62\u97f3\u9891\r\n        audio.pause();\r\n        audio.src = '';\r\n        \/\/ \u53d6\u6d88 active class\r\n        currentCard.classList.remove('active');\r\n        currentCard = null;\r\n      }\r\n\r\n      \/\/ \u6fc0\u6d3b\u5f53\u524d\u5361\u7247\r\n      card.classList.add('active');\r\n      currentCard = card;\r\n\r\n      \/\/ \u542f\u52a8\u65cb\u8f6c\uff08\u5e73\u6ed1\uff09\r\n      if (supportsWA && animations.has(card)) {\r\n        rampPlay(animations.get(card), 1, rampMs);\r\n      } else {\r\n        \/\/ fallback: \u76f4\u63a5\u52a0\u7c7b\u5f00\u59cb\u65cb\u8f6c\uff08\u65e0\u6cd5\u5e73\u6ed1 ramp\uff09\r\n        card.querySelector('.album-cover').classList.add('rotating-fallback');\r\n      }\r\n\r\n      \/\/ \u64ad\u653e\u8be5\u4e13\u8f91\u7684\u7b2c\u4e00\u9996\uff08\u5982\u679c\u6709 data-first\uff09\r\n      if (firstSrc) {\r\n        \/\/ \u5982\u679c\u4e4b\u524d\u6709\u5355\u66f2\u6309\u94ae\u5728\u64ad\u653e\uff0c\u5148\u91cd\u7f6e\u56fe\u793a\r\n        if (currentPlayingBtn) {\r\n          try { currentPlayingBtn.querySelector('i').textContent = '\u25b6'; } catch(e){}\r\n          currentPlayingBtn = null;\r\n        }\r\n        audio.pause();\r\n        audio.src = firstSrc;\r\n        audio.play().catch(() => {\r\n          \/\/ \u67d0\u4e9b\u6d4f\u89c8\u5668\u4f1a\u963b\u6b62\u81ea\u52a8\u64ad\u653e\uff0c\u901a\u5e38\u5728\u7528\u6237\u5df2\u548c\u9875\u9762\u4ea4\u4e92\u540e\u5c31\u80fd\u64ad\u653e\u3002\r\n        });\r\n      }\r\n    });\r\n  });\r\n\r\n  \/\/ \u5355\u66f2\u64ad\u653e\u6309\u94ae\u884c\u4e3a\uff08\u64ad\u653e\/\u6682\u505c\uff09\r\n  const playButtons = Array.from(document.querySelectorAll('.play-btn'));\r\n  playButtons.forEach(btn => {\r\n    btn.addEventListener('click', function (e) {\r\n      e.stopPropagation();\r\n      const src = this.dataset.src;\r\n      \/\/ \u5982\u679c\u5f53\u524d\u64ad\u653e\u7684\u662f\u6b64\u6309\u94ae\u5bf9\u5e94\u97f3\u9891\uff0c\u5219\u6682\u505c\r\n      if (currentPlayingBtn === this) {\r\n        audio.pause();\r\n        this.querySelector('i').textContent = '\u25b6';\r\n        currentPlayingBtn = null;\r\n        return;\r\n      }\r\n\r\n      \/\/ \u5426\u5219\u505c\u6b62\u4e4b\u524d\u7684\uff08\u5e76\u4fee\u6b63\u6309\u94ae\u56fe\u793a\uff09\r\n      if (currentPlayingBtn) {\r\n        try { currentPlayingBtn.querySelector('i').textContent = '\u25b6'; } catch(e){}\r\n      }\r\n\r\n      \/\/ \u5982\u679c\u64ad\u653e\u7684\u4e0d\u662f\u5f53\u524d\u5361\u7247\u5bf9\u5e94\u4e13\u8f91\uff08\u70b9\u51fb\u5355\u66f2\u53ef\u80fd\u6765\u81ea\u672a\u5c55\u5f00\u5361\u7247\uff09\uff0c\u6211\u4eec\u8981\u786e\u4fdd\u90a3\u5f20\u5361\u7247\u5904\u4e8e\u6fc0\u6d3b\u72b6\u6001\uff1a\r\n      const btnCard = this.closest('.album-card');\r\n      if (btnCard && btnCard !== currentCard) {\r\n        \/\/ \u5173\u95ed\u5f53\u524d\u5361\u7247\uff08\u82e5\u6709\uff09\r\n        if (currentCard) {\r\n          if (supportsWA && animations.has(currentCard)) rampStop(animations.get(currentCard));\r\n          else currentCard.querySelector('.album-cover').classList.remove('rotating-fallback');\r\n          currentCard.classList.remove('active');\r\n          \/\/ \u505c\u97f3\r\n          audio.pause(); audio.src = '';\r\n        }\r\n        \/\/ \u6fc0\u6d3b\u8fd9\u5f20\u5361\u7247\u5e76\u542f\u52a8\u65cb\u8f6c\uff08\u4f46\u4e0d\u81ea\u52a8\u64ad\u653e first\uff0c\u56e0\u4e3a\u6309\u7684\u662f\u5355\u66f2\uff09\r\n        btnCard.classList.add('active');\r\n        currentCard = btnCard;\r\n        if (supportsWA && animations.has(btnCard)) rampPlay(animations.get(btnCard), 1, rampMs);\r\n        else btnCard.querySelector('.album-cover').classList.add('rotating-fallback');\r\n      }\r\n\r\n      \/\/ \u64ad\u653e\u8be5\u5355\u66f2\r\n      audio.src = src;\r\n      audio.play().catch(() => {});\r\n      this.querySelector('i').textContent = '\u23f8';\r\n      currentPlayingBtn = this;\r\n    });\r\n  });\r\n\r\n  \/\/ \u5f53 audio \u7ed3\u675f\u65f6\uff0c\u91cd\u7f6e\u5355\u66f2\u6309\u94ae\u56fe\u793a\r\n  audio.addEventListener('ended', () => {\r\n    if (currentPlayingBtn) {\r\n      try { currentPlayingBtn.querySelector('i').textContent = '\u25b6'; } catch(e){}\r\n      currentPlayingBtn = null;\r\n    }\r\n  });\r\n\r\n  \/\/ \u70b9\u51fb\u9875\u9762\u7a7a\u767d\u5904\uff0c\u5173\u95ed\u5f53\u524d active \u5e76\u505c\u6b62\u65cb\u8f6c\u4e0e\u97f3\u9891\r\n  document.addEventListener('click', (e) => {\r\n    if (!e.target.closest('.album-card')) {\r\n      if (currentCard) {\r\n        if (supportsWA && animations.has(currentCard)) rampStop(animations.get(currentCard));\r\n        else currentCard.querySelector('.album-cover').classList.remove('rotating-fallback');\r\n        currentCard.classList.remove('active');\r\n        currentCard = null;\r\n      }\r\n      if (audio) {\r\n        audio.pause(); audio.src = '';\r\n      }\r\n      if (currentPlayingBtn) {\r\n        try { currentPlayingBtn.querySelector('i').textContent = '\u25b6'; } catch(e){}\r\n        currentPlayingBtn = null;\r\n      }\r\n    }\r\n  });\r\n\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-79ba3f3 elementor-widget elementor-widget-html\" data-id=\"79ba3f3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n  .album-container {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 30px;\r\n    justify-content: center;\r\n    padding: 50px 0;\r\n  }\r\n\r\n  .album {\r\n    position: relative;\r\n    width: 180px;\r\n    height: 180px;\r\n    border-radius: 50%;\r\n    overflow: hidden;\r\n    cursor: pointer;\r\n    transition: transform 0.3s ease;\r\n  }\r\n\r\n  .album img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    border-radius: 50%;\r\n    transition: transform 0.5s ease;\r\n  }\r\n\r\n  .album:hover {\r\n    transform: scale(1.05);\r\n  }\r\n\r\n  .album.playing img {\r\n    animation: spin 4s linear infinite;\r\n  }\r\n\r\n  @keyframes spin {\r\n    from { transform: rotate(0deg); }\r\n    to { transform: rotate(360deg); }\r\n  }\r\n\r\n  \/* \u5f39\u51fa\u5c42\u6837\u5f0f *\/\r\n  .music-modal {\r\n    display: none;\r\n    position: fixed;\r\n    inset: 0;\r\n    background: rgba(0, 0, 0, 0.8);\r\n    backdrop-filter: blur(5px);\r\n    justify-content: center;\r\n    align-items: center;\r\n    z-index: 9999;\r\n  }\r\n\r\n  .music-modal.active {\r\n    display: flex;\r\n  }\r\n\r\n  .modal-content {\r\n    background: #111;\r\n    color: white;\r\n    padding: 30px;\r\n    border-radius: 20px;\r\n    max-width: 400px;\r\n    width: 90%;\r\n    text-align: center;\r\n    box-shadow: 0 0 30px rgba(255,255,255,0.2);\r\n  }\r\n\r\n  .song-list {\r\n    margin-top: 20px;\r\n    text-align: left;\r\n  }\r\n\r\n  .song-item {\r\n    padding: 10px;\r\n    border-bottom: 1px solid #333;\r\n    cursor: pointer;\r\n  }\r\n\r\n  .song-item:hover {\r\n    background: rgba(255, 255, 255, 0.1);\r\n  }\r\n\r\n  .close-modal {\r\n    background: #ff0055;\r\n    color: white;\r\n    padding: 8px 16px;\r\n    border-radius: 8px;\r\n    cursor: pointer;\r\n    margin-top: 20px;\r\n    display: inline-block;\r\n  }\r\n\r\n  audio {\r\n    margin-top: 15px;\r\n    width: 100%;\r\n  }\r\n<\/style>\r\n\r\n<div class=\"album-container\">\r\n  <!-- \u4e13\u8f91 1 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/001.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 2 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/002-1.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 3 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/003.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 4 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/004.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 5 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/005.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 6 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/006.png\" alt=\"Album 1\">\r\n  <\/div>\r\n <!-- \u4e13\u8f91 7 -->\r\n  <div class=\"album\" data-album=\"1\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/007.png\" alt=\"Album 1\">\r\n  <\/div>\r\n  <!-- \u4e13\u8f91 8 -->\r\n  <div class=\"album\" data-album=\"2\">\r\n    <img decoding=\"async\" src=\"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/10\/008.png\" alt=\"Album 2\">\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- \u5f39\u51fa\u5c42 -->\r\n<div class=\"music-modal\" id=\"musicModal\">\r\n  <div class=\"modal-content\">\r\n    <h3 id=\"albumTitle\">\u4e13\u8f91\u6807\u9898<\/h3>\r\n    <audio id=\"audioPlayer\" controls><\/audio>\r\n    <div class=\"song-list\" id=\"songList\"><\/div>\r\n    <div class=\"close-modal\" id=\"closeModal\">\u5173\u95ed<\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  const albums = {\r\n    1: {\r\n      title: \"marsix\",\r\n      songs: [\r\n        { title: \"Intro Beat\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Night Ride\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Sunset Flow\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    2: {\r\n      title: \"marsixlab\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    3: {\r\n      title: \"3333\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    4: {\r\n      title: \"4444\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    5: {\r\n      title: \"5555\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    6: {\r\n      title: \"6666\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    7: {\r\n      title: \"7777\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    },\r\n    8: {\r\n      title: \"8888\",\r\n      songs: [\r\n        { title: \"Awakening\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" },\r\n        { title: \"Skyline\", url: \"https:\/\/www.marsixlab.com\/wp-content\/uploads\/2025\/06\/\u5b89\u9759\u8f7b\u5feb\u6b22\u5feb\u94a2\u7434\u66f2\u914d\u4e50\u8f7b\u97f3\u4e50.mp3\" }\r\n      ]\r\n    }\r\n  };\r\n\r\n  const modal = document.getElementById(\"musicModal\");\r\n  const songList = document.getElementById(\"songList\");\r\n  const audioPlayer = document.getElementById(\"audioPlayer\");\r\n  const albumTitle = document.getElementById(\"albumTitle\");\r\n  const closeModal = document.getElementById(\"closeModal\");\r\n  let currentAlbum = null;\r\n\r\n  document.querySelectorAll(\".album\").forEach(album => {\r\n    album.addEventListener(\"click\", () => {\r\n      const id = album.dataset.album;\r\n      const albumData = albums[id];\r\n      currentAlbum = album;\r\n\r\n      \/\/ \u8bbe\u7f6e\u6807\u9898\u4e0e\u6b4c\u66f2\u5217\u8868\r\n      albumTitle.textContent = albumData.title;\r\n      songList.innerHTML = \"\";\r\n      albumData.songs.forEach(song => {\r\n        const div = document.createElement(\"div\");\r\n        div.className = \"song-item\";\r\n        div.textContent = song.title;\r\n        div.addEventListener(\"click\", () => {\r\n          audioPlayer.src = song.url;\r\n          audioPlayer.play();\r\n        });\r\n        songList.appendChild(div);\r\n      });\r\n\r\n      \/\/ \u81ea\u52a8\u64ad\u653e\u7b2c\u4e00\u9996\r\n      audioPlayer.src = albumData.songs[0].url;\r\n      audioPlayer.play();\r\n\r\n      \/\/ \u6253\u5f00\u5f39\u7a97\r\n      modal.classList.add(\"active\");\r\n\r\n      \/\/ \u5f00\u59cb\u65cb\u8f6c\u52a8\u753b\r\n      document.querySelectorAll(\".album\").forEach(a => a.classList.remove(\"playing\"));\r\n      album.classList.add(\"playing\");\r\n    });\r\n  });\r\n\r\n  closeModal.addEventListener(\"click\", () => {\r\n    modal.classList.remove(\"active\");\r\n    audioPlayer.pause();\r\n    document.querySelectorAll(\".album\").forEach(a => a.classList.remove(\"playing\"));\r\n  });\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-24a9ec7 e-grid e-con-boxed e-con e-child\" data-id=\"24a9ec7\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-44f7808 e-flex e-con-boxed e-con e-parent\" data-id=\"44f7808\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-327f831 e-con-full e-flex e-con e-child\" data-id=\"327f831\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-76f07ed e-con-full e-flex e-con e-child\" data-id=\"76f07ed\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Marsix \u306e\u97f3\u4e50\u4e13\u8f91 Ascendance \u25b6 Yi \u25b6 Taoist rhyme \u25b6 Pipa Spa  [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-277","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/pages\/277","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/comments?post=277"}],"version-history":[{"count":187,"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/pages\/277\/revisions"}],"predecessor-version":[{"id":870,"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/pages\/277\/revisions\/870"}],"wp:attachment":[{"href":"https:\/\/www.marsixlab.com\/index.php\/wp-json\/wp\/v2\/media?parent=277"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}