Source

ꯋꯥꯟꯡꯕ

ꯀ꯭ꯂꯥꯁ ꯈꯔ ꯑꯃꯁꯨꯡ ꯑꯩꯈꯣꯌꯒꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯄꯨꯝꯕꯗꯥ ꯀꯟꯇꯦꯟꯇꯁꯤꯡꯒꯤ ꯚꯤꯖꯤꯕꯤꯂꯤꯇꯤ ꯇꯣꯒꯜ ꯇꯧꯕꯤꯌꯨ꯫

ꯃꯁꯤ ꯀꯔꯝꯅꯥ ꯊꯕꯛ ꯇꯧꯕꯒꯦ꯫

ꯀꯣꯂꯥꯞꯁ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤ ꯀꯟꯇꯦꯟꯇ ꯎꯠꯄꯥ ꯑꯃꯁꯨꯡ ꯂꯣꯠꯁꯤꯟꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫ ꯕꯇꯅꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯑꯦꯉ꯭ꯀꯔꯁꯤꯡ ꯑꯁꯤ ꯅꯍꯥꯛꯅꯥ ꯇꯣꯒꯜ ꯇꯧꯕꯥ ꯑꯀꯛꯅꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯗꯥ ꯃꯦꯞ ꯇꯧꯕꯥ ꯇ꯭ꯔꯤꯒꯔꯁꯤꯡ ꯑꯣꯏꯅꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯀꯣꯂꯥꯞꯁ ꯇꯧꯕꯅꯥ heightꯃꯁꯤꯒꯤ ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯚꯦꯜꯌꯨ ꯑꯁꯤꯗꯒꯤ 0. CSSꯅꯥ ꯑꯦꯅꯤꯃꯦꯁꯅꯁꯤꯡ ꯀꯔꯝꯅꯥ ꯍꯦꯟꯗꯜ ꯇꯧꯕꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯌꯦꯡꯂꯒꯥ, ꯅꯍꯥꯛꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ paddingꯑꯃꯗꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯔꯣꯏ꯫ .collapseꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ, ꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯃꯅꯤꯡꯇꯝꯕꯥ ꯔꯦꯄꯤꯡ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯁꯤꯒꯤ ꯑꯦꯅꯤꯃꯦꯁꯟ ꯏꯐꯦꯛꯇ ꯑꯁꯤ prefers-reduced-motionꯃꯦꯗꯤꯌꯥ ꯀ꯭ꯕꯦꯔꯤꯒꯤ ꯃꯈꯥ ꯄꯣꯜꯂꯤ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯑꯦꯛꯁꯦꯁꯤꯕꯤꯂꯤꯇꯤ ꯗꯣꯀꯨꯃꯦꯟꯇꯦꯁꯅꯒꯤ ꯍꯟꯊꯔꯀꯄꯥ ꯃꯣꯁꯟ ꯁꯦꯛꯁꯟ ꯑꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ .

ꯈꯨꯗꯝ

ꯀ꯭ꯂꯥꯁ ꯍꯣꯡꯗꯣꯀꯄꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯇꯣꯞꯄꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯂꯣꯠꯅꯕꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯕꯇꯅꯁꯤꯡ ꯑꯁꯤ ꯀ꯭ꯂꯤꯛ ꯇꯧꯔꯣ:

  • .collapseꯀꯟꯇꯦꯟꯇ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫
  • .collapsingꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡꯒꯤ ꯃꯇꯃꯗꯥ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯏ꯫
  • .collapse.showꯀꯟꯇꯦꯟꯇ ꯎꯠꯂꯤ꯫

ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯂꯤꯉ꯭ꯛ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ href, ꯅꯠꯠꯔꯒꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯕꯇꯟ ꯑꯃꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ data-targetꯌꯥꯏ꯫ ꯀꯦꯁ ꯑꯅꯤꯃꯛꯇꯥ, ꯗꯤ data-toggle="collapse"ꯑꯁꯤ ꯃꯊꯧ ꯇꯥꯏ꯫

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
<p>
  <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">
    Link with href
  </a>
  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
    Button with data-target
  </button>
</p>
<div class="collapse" id="collapseExample">
  <div class="card card-body">
    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
  </div>
</div>

ꯃꯁꯤꯡ ꯌꯥꯝꯂꯕꯥ ꯄꯥꯟꯗꯃꯁꯤꯡ꯫

A <button>ꯅꯠꯠꯔꯒꯥ ꯃꯁꯤꯒꯤ ꯅꯠꯠꯔꯒꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯇꯥ <a>JQuery ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯈꯣꯌꯕꯨ ꯔꯦꯐꯥꯔꯦꯟꯁ ꯇꯧꯗꯨꯅꯥ ꯃꯁꯤꯡ ꯌꯥꯝꯂꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯎꯠꯄꯥ ꯑꯃꯁꯨꯡ ꯂꯣꯠꯄꯥ ꯌꯥꯏ꯫ ꯃꯜꯇꯤꯄꯜ ꯅꯠꯠꯔꯒꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯈꯣꯌ ꯈꯨꯗꯤꯡꯃꯛꯅꯥ ꯃꯈꯣꯌꯒꯤ ꯅꯠꯠꯔꯒꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯔꯤꯐꯔꯦꯟꯁ ꯇꯧꯔꯕꯗꯤ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯄꯥ ꯑꯃꯁꯨꯡ ꯂꯣꯠꯄꯥ ꯌꯥꯏ꯫hrefdata-target<button><a>hrefdata-target

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
<p>
  <a class="btn btn-primary" data-toggle="collapse" href="#multiCollapseExample1" role="button" aria-expanded="false" aria-controls="multiCollapseExample1">Toggle first element</a>
  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#multiCollapseExample2" aria-expanded="false" aria-controls="multiCollapseExample2">Toggle second element</button>
  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target=".multi-collapse" aria-expanded="false" aria-controls="multiCollapseExample1 multiCollapseExample2">Toggle both elements</button>
</p>
<div class="row">
  <div class="col">
    <div class="collapse multi-collapse" id="multiCollapseExample1">
      <div class="card card-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
      </div>
    </div>
  </div>
  <div class="col">
    <div class="collapse multi-collapse" id="multiCollapseExample2">
      <div class="card card-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
      </div>
    </div>
  </div>
</div>

ꯑꯦꯀꯣꯔꯗꯅꯒꯤ ꯈꯨꯗꯝ꯫

ꯀꯥꯔꯗ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ , ꯅꯍꯥꯛꯅꯥ ꯑꯦꯀꯣꯔꯗꯟ ꯑꯃꯥ ꯁꯦꯝꯅꯕꯥ ꯗꯤꯐꯣꯜꯇ ꯀꯣꯂꯥꯞꯁ ꯕꯤꯍꯦꯕꯤꯌꯔ ꯑꯗꯨ ꯁꯥꯡꯗꯣꯀꯄꯥ ꯌꯥꯏ꯫ ꯑꯦꯀꯣꯔꯗꯟ ꯁ꯭ꯇꯥꯏꯜ ꯑꯗꯨ ꯃꯑꯣꯡ ꯆꯨꯝꯅꯥ ꯐꯪꯅꯕꯒꯤꯗꯃꯛ, .accordionꯔꯦꯄꯔ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯁꯣꯌꯗꯅꯥ ꯁꯤꯖꯤꯟꯅꯧ꯫

ꯑꯅꯤꯝ ꯄꯥꯔꯤꯑꯦꯇꯨꯔ ꯀ꯭ꯂꯤꯆ ꯔꯤꯞꯔꯦꯍꯦꯟꯗꯔꯤꯠ, ꯑꯦꯅꯤꯝ ꯏꯌꯨꯁꯃꯣꯗ ꯍꯥꯏ ꯂꯥꯏꯐ ꯑꯦꯛꯌꯨꯁꯥꯃꯁ ꯇꯦꯔꯤ ꯔꯤꯆꯥꯔꯗꯁꯟ ꯑꯦꯗ ꯁ꯭ꯀꯨꯏꯗ꯫ ꯳ ꯋꯨꯜꯐ ꯃꯨꯟ ꯑꯣꯐꯤꯁꯤꯌꯥ ꯑꯎꯇꯦ, ꯅꯟ ꯀ꯭ꯌꯨꯄꯤꯗꯥꯠ ꯁ꯭ꯀꯦꯇꯕꯣꯔꯗ ꯗꯣꯂꯣꯔ ꯕ꯭ꯔꯟꯆ꯫ ꯐꯨꯗ ꯇ꯭ꯔꯛ ꯀꯨꯏꯅꯣꯌꯥ ꯅꯦꯁꯁꯤꯎꯟꯇ ꯂꯦꯕꯣꯔꯝ ꯏꯌꯨꯁꯃꯣꯗ꯫ ꯕ꯭ꯔꯟꯆ ꯳ ꯋꯨꯜꯐ ꯃꯟ ꯇꯦꯝꯄꯣꯔ, ꯁꯟꯇ ꯑꯦꯂꯤꯛꯌꯨꯌꯥꯅꯥ ꯃꯁꯤꯗꯥ ꯄꯥꯈꯪ ꯑꯃꯥ ꯊꯝꯃꯤ ꯁ꯭ꯀꯨꯏꯗ ꯁꯤꯉ꯭ꯒꯜ-ꯑꯣꯔꯤꯖꯤꯟ ꯀꯐꯤ ꯅꯨꯜꯂꯥ ꯑꯦꯁꯨꯃꯦꯟꯗꯥ ꯁꯣꯔꯦꯗꯤꯆ ꯑꯦꯠ. ꯅꯤꯍꯤꯜ ꯑꯦꯅꯤꯝ ꯀꯦꯐꯤꯌꯦꯍ ꯍꯦꯂꯚꯦꯇꯤꯀꯥ, ꯀ꯭ꯔꯥꯐ꯭ꯠ ꯕꯤꯌꯔ ꯂꯦꯕꯔ ꯋꯦꯁ ꯑꯦꯟꯗꯔꯁꯟ ꯀ꯭ꯔꯦꯗ ꯅꯦꯁꯁꯤꯎꯟꯇ ꯁꯦꯄꯤꯌꯦꯟꯇ ꯏꯑꯦ ꯄ꯭ꯔꯣꯏꯗꯦꯟꯇ꯫ ꯑꯦꯗ ꯚꯦꯒꯥꯟ ꯑꯦꯛꯁꯦꯞꯇꯔ ꯕꯨꯠꯆꯦꯔ ꯚꯥꯏꯁ ꯂꯣꯃꯣ꯫ ꯂꯦꯒꯤꯡꯁ ꯑꯣꯀꯦꯀꯦꯠ ꯀ꯭ꯔꯥꯐ꯭ꯠ ꯕꯤꯌꯔ ꯐꯥꯔꯝ-ꯇꯨ-ꯇꯦꯕꯜ, ꯑꯀꯪꯕꯥ ꯗꯦꯅꯤꯝ ꯑꯦꯁ꯭ꯇꯦꯇꯤꯛ ꯁꯤꯟꯊ ꯅꯦꯁꯤꯌꯟꯇ ꯅꯍꯥꯛꯅꯥ ꯃꯈꯣꯌꯒꯤ ꯃꯔꯃꯗꯥ ꯇꯥꯕꯥ ꯐꯪꯂꯃꯂꯣꯏꯗꯕꯅꯤ ꯑꯦꯛꯌꯨꯁ��ꯃꯁ ꯂꯦꯕꯔ ꯁꯁ꯭ꯇꯦꯅꯦꯕꯜ ꯚꯤ.ꯑꯩꯆ.ꯑꯦꯁ.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
<div class="accordion" id="accordionExample">
  <div class="card">
    <div class="card-header" id="headingOne">
      <h2 class="mb-0">
        <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
          Collapsible Group Item #1
        </button>
      </h2>
    </div>

    <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
      <div class="card-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
      </div>
    </div>
  </div>
  <div class="card">
    <div class="card-header" id="headingTwo">
      <h2 class="mb-0">
        <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
          Collapsible Group Item #2
        </button>
      </h2>
    </div>
    <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
      <div class="card-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
      </div>
    </div>
  </div>
  <div class="card">
    <div class="card-header" id="headingThree">
      <h2 class="mb-0">
        <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
          Collapsible Group Item #3
        </button>
      </h2>
    </div>
    <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
      <div class="card-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
      </div>
    </div>
  </div>
</div>

ꯑꯦꯛꯁꯦꯁꯤꯕꯤꯂꯤꯇꯤ ꯂꯩꯕꯥ꯫

aria-expandedꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯁꯣꯌꯗꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯃꯁꯤꯒꯤ ꯑꯦꯠꯔꯤꯕ꯭ꯌꯨꯠ ꯑꯁꯤꯅꯥ ꯁ꯭ꯛꯔꯤꯟ ꯔꯤꯗꯔꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯑꯦꯁꯤꯁ꯭ꯇꯦꯟꯇ ꯇꯦꯛꯅꯣꯂꯣꯖꯤꯁꯤꯡꯗꯥ ꯀꯟꯠꯔꯣꯂꯒꯥ ꯇꯤꯡꯂꯕꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇꯀꯤ ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯐꯤꯚꯝ ꯑꯗꯨ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ ꯇꯥꯀꯏ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯂꯣꯗ ꯇꯧꯔꯕꯗꯤ, ꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯂꯩꯕꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯒꯤ ꯚꯦꯜꯌꯨ ꯑꯗꯨ aria-expanded="false". ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ showꯀ꯭ꯂꯥꯁ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯑꯣꯄꯟ ꯇꯧꯅꯕꯥ ꯁꯦꯠ ꯇꯧꯔꯕꯗꯤ, aria-expanded="true"ꯃꯗꯨꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯀꯟꯠꯔꯣꯂꯗꯥ ꯁꯦꯠ ꯇꯧꯔꯣ. ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯅꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯍꯥꯡꯗꯣꯀꯄꯥ ꯅꯠꯠꯔꯒꯥ ꯂꯣꯗ ꯇꯧꯕꯥ (ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ, ꯅꯠꯠꯔꯒꯥ ꯌꯨꯖꯔꯅꯥ ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯥ ꯇꯤꯡꯂꯕꯥ ꯑꯇꯣꯞꯄꯥ ꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯁꯨ ꯇ꯭ꯔꯤꯒꯔ ꯇꯧꯈꯤꯕꯅꯥ ꯃꯔꯝ ꯑꯣꯏꯗꯨꯅꯥ) ꯌꯨꯝꯐꯝ ꯑꯣꯏꯗꯨꯅꯥ ꯀꯟꯠꯔꯣꯂꯗꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯁꯤ ꯑꯣꯇꯣꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯇꯣꯒꯜ ꯇꯧꯒꯅꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯤ HTML ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯕꯇꯟ ꯑꯃꯥ ꯑꯣꯏꯗ꯭ꯔꯕꯗꯤ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, an <a>ꯅꯠꯠꯔꯒꯥ <div>), ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨrole="button"ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯍꯥꯄꯆꯤꯅꯒꯗꯕꯅꯤ꯫

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯀꯤ ꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯅꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯈꯛꯇꯃꯛ ꯇꯥꯔꯒꯦꯠ ꯇꯧꯔꯕꯗꯤ – ꯍꯥꯌꯕꯗꯤ data-targetꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯅꯥ ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯗꯥ ꯄꯣꯏꯟꯇ ꯇꯧꯔꯕꯗꯤ – ꯅꯍꯥꯛꯅꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨ ꯀꯟꯠꯔꯣꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ idꯍꯥꯄꯀꯗꯕꯅꯤ , ꯃꯁꯤꯗꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯤ ꯑꯗꯨ ꯌꯥꯎꯒꯗꯕꯅꯤ꯫ ꯃꯣꯗꯔꯟ ꯁ꯭ꯛꯔꯤꯟ ꯔꯤꯗꯔꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯃꯁꯤꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯑꯦꯁꯤꯁ꯭ꯇꯦꯟꯇ ꯇꯦꯛꯅꯣꯂꯣꯖꯤꯁꯤꯡꯅꯥ ꯑꯦꯠꯔꯤꯕ꯭ꯌꯨꯠ ꯑꯁꯤ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯌꯨꯖꯔꯁꯤꯡꯗꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯃꯁꯥꯃꯛꯇꯗꯥ ꯍꯀꯊꯦꯡꯅꯅꯥ ꯆꯠꯅꯕꯥ ꯑꯍꯦꯅꯕꯥ ꯁꯣꯔꯇꯀꯥꯠꯁꯤꯡ ꯄꯤꯔꯤ꯫aria-controlsid

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯍꯧꯖꯤꯛꯀꯤ ꯏꯃꯞꯂꯤꯃꯦꯟꯇꯦꯁꯟ ꯑꯁꯤꯅꯥ WAI-ARIA ꯑꯣꯊꯣꯔꯤꯡ ꯄ꯭ꯔꯦꯛꯇꯤꯁꯁꯤꯡ 1.1 ꯑꯦꯀꯣꯔꯗꯟ ꯄꯦꯇꯔꯅꯗꯥ ꯄꯅꯈ꯭ꯔꯤꯕꯥ ꯇꯣꯉꯥꯟ-ꯇꯣꯉꯥꯅꯕꯥ ꯀꯤꯕꯣꯔꯗ ꯏꯟꯇꯔꯦꯛꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯀꯣꯅꯁꯤꯅꯗꯦ ꯍꯥꯌꯕꯁꯤ ꯈꯪꯖꯤꯅꯕꯤꯌꯨ - ꯅꯍꯥꯛꯅꯥ ꯃꯈꯣꯌ ꯑꯁꯤ ꯃꯁꯥꯅꯥ ꯀꯁ꯭ꯇꯝ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯌꯥꯑꯣꯍꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯒꯅꯤ꯫

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

ꯀꯣꯂꯥꯞꯁ ꯄ꯭ꯂꯒꯏꯟ ꯑꯁꯤꯅꯥ ꯍꯦꯚꯤ ꯂꯤꯐꯇꯤꯡ ꯍꯦꯟꯗꯜ ꯇꯧꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯈꯔꯥ ꯁꯤꯖꯤꯟꯅꯩ:

  • .collapseꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫
  • .collapse.showꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯎꯠꯂꯤ꯫
  • .collapsingꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯍꯧꯔꯀꯄꯥ ꯃꯇꯃꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯤ, ꯑꯃꯁꯨꯡ ꯂꯣꯏꯔꯕꯥ ꯃꯇꯃꯗꯥ ꯂꯧꯊꯣꯀꯏ꯫

ꯍꯥꯌꯔꯤꯕꯥ ꯀ꯭ꯂꯥꯁꯁꯤꯡ ꯑꯁꯤ _transitions.scss.

ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯅꯠꯠꯔꯒꯥ ꯑꯃꯗꯒꯤ ꯍꯦꯅꯕꯥ ꯀꯟꯠꯔꯣꯜ ꯑꯗꯨ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯑꯦꯁꯥꯏꯟ ꯇꯧꯅꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ data-toggle="collapse"ꯑꯃꯁꯨꯡ ꯑꯦ ꯈꯛꯇꯃꯛ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ data-targetꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨꯅꯥ data-targetꯀꯣꯂꯥꯞꯁ ꯑꯗꯨ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯅꯕꯥ CSS ꯁꯦꯂꯦꯛꯇꯔ ꯑꯃꯥ ꯌꯥꯔꯦ꯫ collapseꯀ꯭ꯂꯥꯁ ꯑꯗꯨ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯗꯥ ꯁꯣꯌꯗꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯃꯁꯤ ꯗꯤꯐꯣꯜꯇ ꯑꯣꯏꯅꯥ ꯍꯥꯡꯗꯣꯀꯄꯥ ꯄꯥꯝꯂꯕꯗꯤ, ꯑꯍꯦꯅꯕꯥ ꯀ꯭ꯂꯥꯁ ꯍꯥꯄꯆꯤꯜꯂꯨ show.

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯔꯤꯌꯥ ꯑꯃꯗꯥ ꯑꯦꯀꯣꯔꯗꯅꯒꯨꯝꯕꯥ ꯒ꯭ꯔꯨꯞ ꯃꯦꯅꯦꯖꯃꯦꯟꯇ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ, ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯍꯥꯄꯆꯤꯜꯂꯨ data-parent="#selector". ꯃꯁꯤ ꯊꯕꯛ ꯑꯣꯏꯅꯥ ꯎꯅꯕꯒꯤꯗꯃꯛ ꯗꯦꯃꯣ ꯑꯗꯨ ꯌꯦꯡꯕꯤꯌꯨ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ꯫

ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯏꯅꯦꯕꯜ ꯇꯧꯕꯤꯌꯨ:

$('.collapse').collapse()

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯑꯁꯤ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯄꯥꯁ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡꯒꯤ ꯑꯣꯏꯅꯗꯤ, ꯑꯣꯄꯁꯅꯒꯤ ꯃꯃꯤꯡ ꯑꯗꯨ data-, data-parent="".

ꯃꯤꯡ ꯃꯈꯜ ꯀꯥꯡꯂꯣꯟ ꯏꯟꯗꯕ ꯋꯥꯔꯣꯜ
ꯃꯃꯥ-ꯃꯄꯥ ꯑꯣꯏꯕꯥ꯫ ꯁꯦꯂꯦꯛꯇꯔ ꯇꯧꯕꯥ | jQuery ꯑꯣꯕꯖꯦꯛꯇ | ꯗꯤ.ꯑꯣ.ꯑꯦꯝ.ꯒꯤ ꯑꯦꯂꯤꯃꯦꯟꯇ꯫ ꯑꯔꯥꯟꯕ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯃꯥ-ꯃꯄꯥ ꯑꯗꯨ ꯄꯤꯔꯕꯗꯤ, ꯃꯗꯨꯒꯤ ꯃꯇꯨꯡꯗꯥ ꯑꯀꯛꯅꯕꯥ ꯃꯃꯥ-ꯃꯄꯥ ꯑꯗꯨꯒꯤ ꯃꯈꯥꯗꯥ ꯂꯩꯕꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯄꯨꯝꯅꯃꯛ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯥꯏꯇꯦꯝ ꯑꯁꯤ ꯎꯠꯄꯥ ꯃꯇꯃꯗꯥ ꯂꯣꯗ ꯇꯧꯒꯅꯤ꯫ (ꯇ꯭ꯔꯦꯗꯤꯁꯅꯦꯜ ꯑꯦꯀꯣꯔꯗꯟ ꯕꯤꯍꯦꯕꯤꯌꯔꯒꯥ ꯃꯥꯟꯅꯩ - ꯃꯁꯤ cardꯀ꯭ꯂꯥꯁꯀꯤ ꯃꯈꯥ ꯄꯣꯜꯂꯤ)꯫ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯗꯨ ꯇꯥꯔꯒꯦꯠ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯔꯤꯌꯥ ꯑꯗꯨꯗꯥ ꯁꯦꯠ ꯇꯧꯒꯗꯕꯅꯤ꯫
ꯇꯣꯒꯜ ꯇꯧꯕꯥ꯫ ꯕꯨꯂꯦꯅꯒꯤ ꯑꯣꯏꯕꯥ꯫ ꯑꯆꯨꯝꯕ ꯏꯅꯚꯣꯀꯦꯁꯟꯗꯥ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯇꯣꯒꯜ ꯇꯧꯏ꯫

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

ꯑꯦꯁꯤꯅꯛꯔꯣꯅꯣꯁ ꯃꯦꯊꯗꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡ꯫

ꯑꯦ.ꯄꯤ.ꯑꯥꯏ.ꯒꯤ ꯃꯦꯊꯗ ꯄꯨꯝꯅꯃꯛ ꯑꯁꯤ ꯑꯦꯁꯤꯅꯛꯔꯣꯅꯣꯁ ꯑꯣꯏ ꯑꯃꯁꯨꯡ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯑꯃꯥ ꯍꯧꯏ . ꯃꯈꯣꯌꯅꯥ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯍꯧꯔꯀꯄꯥ ꯃꯇꯃꯗꯥ ꯑꯗꯨꯕꯨ ꯂꯣꯏꯗ꯭ꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ ꯀꯣꯜ ꯇꯧꯔꯤꯕꯥ ꯃꯤꯑꯣꯏ ꯑꯗꯨꯗꯥ ꯍꯜꯂꯀꯏ . ꯃꯁꯤꯒꯤ ꯃꯊꯛꯇꯥ, ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯇꯧꯔꯤꯕꯥ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯗꯥ ꯃꯦꯊꯗ ꯀꯣꯜ ꯑꯃꯥ ꯏꯒꯅꯣꯔ ꯇꯧꯒꯅꯤ .

ꯑꯍꯦꯅꯕꯥ ꯏꯅꯐꯣꯔꯃꯦꯁꯅꯒꯤꯗꯃꯛꯇꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯦꯁꯟ ꯌꯦꯡꯕꯤꯌꯨ .

.collapse(options)

ꯅꯍꯥꯛꯀꯤ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯑꯦꯛꯇꯤꯚ ꯇꯧꯏ꯫ ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯟ ꯑꯃꯥ ꯌꯥꯔꯦ object.

$('#myCollapsible').collapse({
  toggle: false
})

.collapse('toggle')

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯄꯥ ꯅꯠꯠꯔꯒꯥ ꯂꯣꯠꯁꯤꯟꯅꯕꯥ ꯇꯣꯒꯜ ꯇꯧꯏ꯫ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯇꯁꯦꯡꯅꯥ ꯎꯠꯄꯥ ꯅꯠꯠꯔꯒꯥ ꯂꯣꯠꯁꯤꯜꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ shown.bs.collapseꯅꯠꯠꯔꯒꯥ hidden.bs.collapseꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯂꯔꯗꯥ ꯍꯜꯂꯀꯏ꯫

.collapse('show')

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯠꯂꯤ꯫ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯇꯁꯦꯡꯅꯥ ꯎꯠꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ shown.bs.collapseꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯂꯔꯗꯥ ꯍꯜꯂꯀꯏ꯫

.collapse('hide')

ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ꯫ ꯀꯣꯂꯥꯞꯁꯤꯕꯜ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨ ꯇꯁꯦꯡꯅꯥ ꯂꯣꯠꯁꯤꯜꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ hidden.bs.collapseꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯂꯔꯗꯥ ꯍꯜꯂꯀꯏ꯫

.collapse('dispose')

ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯒꯤ ꯀꯣꯂꯥꯞꯁ ꯑꯗꯨ ꯃꯥꯡꯍꯜꯂꯤ꯫

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯀꯣꯂꯥꯄꯁ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯀꯣꯂꯥꯄꯁ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯈꯔꯥ ꯑꯦꯛꯁꯄꯣꯖ ꯇꯧꯏ꯫

ꯏꯚꯦꯟꯇ ꯃꯈꯜ꯫ ꯋꯥꯔꯣꯜ
ꯁꯣ.ꯕꯤ.ꯑꯦꯁ.ꯀꯣꯂꯥꯄꯁ ꯇꯧꯕꯥ꯫ showꯏꯟꯁꯇꯦꯟꯁ ꯃꯦꯊꯗ ꯀꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯊꯧꯗꯣꯛ ꯑꯁꯤ ꯈꯨꯗꯛꯇꯥ ꯐꯥꯏꯔ ꯇꯧꯏ꯫
shown.bs.ꯀꯣꯂꯥꯄꯁ ꯇꯧꯕꯥ꯫ ꯏꯚꯦꯟꯇ ꯑꯁꯤ ꯌꯨꯖꯔꯗꯥ ꯀꯣꯂꯥꯞꯁ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯎꯕꯥ ꯐꯪꯍꯅꯕꯥ ꯃꯇꯃꯗꯥ ꯐꯥꯏꯔ ꯇꯧꯏ (CSS ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡ ꯂꯣꯏꯁꯤꯟꯅꯕꯥ ꯉꯥꯏꯒꯅꯤ)꯫
ꯂꯣꯠꯄꯥ.ꯕꯤ.ꯑꯦꯁ.ꯀꯣꯂꯥꯞꯁ ꯇꯧꯕꯥ꯫ hideꯃꯦꯊꯗ ꯑꯗꯨ ꯀꯧꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ ꯊꯧꯗꯣꯛ ꯑꯁꯤ ꯈꯨꯗꯛꯇꯥ ꯐꯥꯏꯔ ꯇꯧꯏ꯫
ꯂꯣꯠꯁꯤꯜꯂꯕꯥ.ꯕꯤ.ꯑꯦꯁ.ꯀꯣꯂꯥꯞꯁ ꯇꯧꯕꯥ꯫ ꯏꯚꯦꯟꯇ ꯑꯁꯤ ꯌꯨꯖꯔꯗꯒꯤ ꯀꯣꯂꯥꯞꯄꯁ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯃꯥ ꯂꯣꯠꯁꯤꯜꯂꯕꯥ ꯃꯇꯃꯗꯥ ꯐꯥꯏꯔ ꯇꯧꯏ (CSS ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡ ꯂꯣꯏꯁꯤꯟꯅꯕꯥ ꯉꯥꯏꯒꯅꯤ)꯫
$('#myCollapsible').on('hidden.bs.collapse', function () {
  // do something...
})