アンカー - セクションヘッダーへのアコーディオンリンク

Question

AMPページメニューでは、いくつかのセクションがあります。この場合、セクションヘッダーに直接リンクしたいと考えています。私たちはこれをすることができませんでした。この分野の助けや指導をいただければ幸いです。たとえば、次のコードでは、「ネストされたセクション2.1」にリンクします。クリックすると、直接ターゲットページに移動し、セクションを開きません。

<amp-accordion> 
<section> 
    <h4>Section 1</h4> 
    <p>Bunch of content.</p> 
</section> 
<section> 
    <h4>Section 2</h4> 
    <amp-accordion class="nested-accordion"> 
    <section> 
     <h4>Nested Section 2.1</h4> 
     <p>Bunch of content.</p> 
    </section> 
    <section> 
     <h4>Nested Section 2.2</h4> 
     <p>Bunch of more content.</p> 
    </section> 
    </amp-accordion> 
</section> 

Answer 1

私は実際にAMPページについてほとんど知っているし、まだそれについての詳細を学ぶしようとしているが、AMP's official documentationからベース、amp-accordionの動作は以下の通りです：

• アンアンプ - アコーディオンは、直接の子として1つ以上の<section>を含むことができる。
• 各<section>には、正確に2つの直接の子が含まれている必要があります。
• （セクションの）最初の子は、h1、h2、...、h6、headerのいずれかでなければならず、セクションの見出しです。
• （セクションの）2番目の子は、AMP HTMLで許可された任意のタグで、セクションの内容です。
• セクションの見出しをクリックまたはタップすると、セクションが展開または折りたたまれます。

また、有用な洞察のため10 Important Accelerated Mobile Pages (AMP) Components You Should Knowをチェックすることもできます。

希望に役立ちます！

Answer 2

はアコーディオンにこれらのセクションを配置し、アコーディオンヘッダに自分のスタイルに合わせ、例えばないでください：

<amp-accordion> 
<section> 
    <h4>Section 1</h4> 
    <p>Bunch of content.</p> 
</section> 
<section> 
    <h4>Section 2</h4> 

    <div> 
    <h4><a href="...">Nested Section 2.1</a></h4> 
    <amp-accordion class="nested-accordion"> 
     <section> 
     <h4>Nested Section 2.2</h4> 
     <p>Bunch of more content.</p> 
     </section> 
    </amp-accordion> 
    </div> 

</section>