37 lines
6.2 KiB
HTML
37 lines
6.2 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover"><meta name="theme-color" content="#f8f7f2"><meta name="description" content="触摸、拆解、移动，认识 Reformer 核心床的机械结构与弹簧原理。"><title>认识核心床 · Focus Core 探索</title><!-- __THIRD_PARTY_LICENSE__ --><style>/*__CSS__*/</style></head>
|
|
<body><main>
|
|
<header class="masthead"><div class="brand">FOCUS CORE<span>MOVEMENT LIBRARY</span></div><span class="issue">探索 · 器械篇 001</span></header>
|
|
<section class="intro"><div><div class="eyebrow">器械图鉴</div><h1>认识核心床</h1><p>在一推一回之间，读懂阻力。</p></div><span class="edition" aria-hidden="true">01</span></section>
|
|
<div class="layout">
|
|
<div>
|
|
<section class="diagram-panel iso-plate" aria-label="核心床交互图鉴">
|
|
<div class="diagram-top"><span class="figure-label">Fig. 01 / Reformer</span><div class="view-toggle interactive" role="group" aria-label="结构视图"><button data-view="assembled" aria-pressed="true">组装</button><button data-view="exploded" aria-pressed="false">分解</button></div></div>
|
|
<div class="stage">__FIGURE__</div>
|
|
<div class="diagram-foot"><span><i class="legend-dot"></i><span id="view-hint">轻点部件，探索它的作用</span></span><span data-readout>结构与行程均为示意</span></div>
|
|
<p class="no-js-note">当前为静态图鉴。下方可阅读全部部件说明；交互需在支持 JavaScript 的浏览器中打开。</p>
|
|
</section>
|
|
<nav class="part-list interactive" aria-label="选择器械部件">__PART_BUTTONS__</nav>
|
|
<section class="part-detail interactive interactive-block" aria-labelledby="part-name"><div class="part-heading"><span id="part-number" class="part-number">01</span><div><h2 id="part-name">滑动床板</h2><div id="part-en" class="english">Carriage</div></div></div><p id="part-description"></p><div class="observation" id="part-observation"></div></section>
|
|
<dl class="static-parts">__STATIC_PARTS__</dl>
|
|
</div>
|
|
<section class="controls interactive interactive-block" aria-label="运动与弹簧控制">
|
|
<div class="section-heading"><h2>让原理，动起来</h2><span class="small">TRY IT YOURSELF</span></div>
|
|
<div class="position-row"><label for="position">床板位置</label><output id="position-value" class="position-value">0<small>%</small></output></div>
|
|
<input id="position" class="range" type="range" min="0" max="100" step="0.1" value="0" aria-label="床板在示意行程中的位置">
|
|
<div class="range-ends"><span>靠近脚踏端</span><span>远离脚踏端</span></div>
|
|
<div class="playback"><div class="play-row"><button class="play" id="play" aria-label="播放动作"><svg viewBox="0 0 20 20" aria-hidden="true"><path id="play-icon" d="M7 4L16 10L7 16Z"/></svg><span id="play-label">播放演示</span></button><button class="replay" id="replay" aria-label="从头回放"><svg viewBox="0 0 20 20" aria-hidden="true"><path d="M4 7a7 7 0 1 1-1 6M4 2v5h5"/></svg></button><span class="phase" id="phase">起始位置</span></div>
|
|
<div class="timeline-row"><input id="timeline" class="range" type="range" min="0" max="100" step="0.1" value="0" aria-label="动作播放进度"><output id="progress-value">0%</output></div><div class="timeline-label">动作进度 · 推出 → 回程 · 节奏仅为示意</div></div>
|
|
<section class="spring-section"><div class="section-heading"><h2>换一组弹簧，看看变化</h2><span id="spring-count" class="small">已连接 2 / 5</span></div><div class="spring-buttons" role="group" aria-label="弹簧挂接组合">__SPRING_BUTTONS__</div><div class="spring-presets"><button data-preset="b1">一根蓝簧</button><button data-preset="r1,b1">红＋蓝</button><button data-preset="r1,r2,r3,b1,g1">全部连接</button></div>
|
|
<div class="spring-readout"><div class="row"><span>已连接弹簧的伸长</span><span id="extension-state">起始长度</span></div><svg class="spring-graphic" viewBox="0 0 280 43" role="img" aria-label="已连接弹簧随床板位移伸长的示意"><path id="spring-mini" d=""/><circle cx="8" cy="22" r="3"/><circle id="spring-mini-end" cx="95" cy="22" r="3"/></svg><div class="row"><span>弹簧拉力</span><span>待实测标定</span></div></div>
|
|
<p class="fine">颜色仅对应本期参考机型。未接入真实弹簧参数，不计算阻力数值。组合切换用于理解结构，不作为训练建议。</p></section>
|
|
</section>
|
|
</div>
|
|
<section class="principle"><div class="eyebrow">A LITTLE UNDERSTANDING, A BETTER PRACTICE</div><h2>阻力，藏在弹簧的变化里。</h2><p>床板向外滑动时，已连接的弹簧随之伸长，产生朝向脚踏端的拉力。回程时，这股拉力仍然存在；<strong>控制回程</strong>也是练习的一部分。</p><div class="insight"><span class="leaf" aria-hidden="true">↗</span><div><h3>弹簧更多，不一定更难。</h3><p>弹簧既可能提供阻力，也可能提供辅助。难度还取决于动作、身体位置与控制要求，由教练选择合适组合。</p></div></div></section>
|
|
<section class="more"><details><summary>关于本期图鉴</summary><p>参考 __REFERENCE__。五根弹簧以 3 红、1 蓝、1 绿表示；不同品牌的结构与颜色定义可能不同。</p><p>本图为器械原理示意，比例、行程与播放节奏不代表实机设定。实际使用请遵循器械说明与教练指导。</p><div class="source-links">__SOURCES__</div></details><details><summary>查看静态图鉴</summary><p>无法运行动画时，可阅读这张结构图和全部中文部件说明。</p><button id="static-toggle" class="play js-only">切换为静态阅读</button><noscript><p>你当前已在静态阅读模式。</p></noscript></details></section>
|
|
<section id="teaching-media" class="more" hidden><h2 id="media-placeholder"></h2><div id="external-media" hidden></div></section>
|
|
<footer><span>FOCUS CORE · 慢慢理解，好好练习</span><span>VOL. 001</span></footer>
|
|
<div id="announcement" class="sr-only" role="status" aria-live="polite"></div>
|
|
</main><script>/*__SCRIPT__*/</script></body></html>
|