in English

ꯀꯦꯔꯣꯁꯤꯜ ꯇꯧꯕꯥ꯫

ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯁ꯭ꯂꯥꯏꯗꯁꯣ ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯥ-ꯏꯃꯦꯖꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯇꯦꯛꯁꯇꯀꯤ ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡ-ꯀꯦꯔꯣꯁꯦꯂꯒꯨꯝꯕꯥ꯫

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

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯀꯟꯇꯦꯟꯇꯁꯤꯡꯒꯤ ꯁꯤꯔꯤꯖ ꯑꯃꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯥꯏꯛꯂꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯁ꯭ꯂꯥꯏꯗꯁꯣ ꯑꯃꯅꯤ, ꯃꯁꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.꯳ꯗꯤ ꯇ꯭ꯔꯥꯟꯁꯐꯣꯔꯃꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯈꯔꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯦꯃꯈꯤꯕꯅꯤ꯫ ꯃꯁꯤꯅꯥ ꯏꯃꯦꯖꯁꯤꯡ, ꯇꯦꯛꯁꯠ ꯅꯠꯠꯔꯒꯥ ꯀꯁ꯭ꯇꯝ ꯃꯥꯔꯀꯑꯥꯄꯀꯤ ꯁꯤꯔꯤꯖ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯊꯕꯛ ꯇꯧꯏ꯫ ꯃꯁꯤꯗꯥ ꯃꯃꯥꯡꯒꯤ/ꯃꯊꯪꯒꯤ ꯀꯟꯠꯔꯣꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡꯒꯤ ꯁꯄꯣꯔꯇꯁꯨ ꯌꯥꯑꯣꯔꯤ꯫

ꯄꯦꯖ ꯚꯤꯖꯤꯕꯤꯂꯤꯇꯤ API ꯁꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯕ꯭ꯔꯥꯎꯖꯔꯁꯤꯡꯗꯥ , ꯋꯦꯕꯄꯦꯖ ꯑꯗꯨ ꯌꯨꯖꯔꯅꯥ ꯎꯕꯥ ꯐꯪꯗꯕꯥ ꯃꯇꯃꯗꯥ (ꯕ꯭ꯔꯥꯎꯖꯔ ꯇꯦꯕ ꯑꯗꯨ ꯏꯅꯑꯦꯛꯇꯤꯚ ꯑꯣꯏꯕꯥ ꯃꯇꯃꯗꯥ, ꯕ꯭ꯔꯥꯎꯖꯔ ꯎꯏꯟꯗꯣ ꯑꯗꯨ ꯃꯤꯅꯤꯃꯝ ꯑꯣꯏꯕꯥ ꯃꯇꯃꯗꯥ, ꯑꯁꯤꯅꯆꯤꯡꯕꯥ) ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯅꯥ ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯕꯥ ꯊꯤꯡꯒꯅꯤ꯫

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

ꯆꯥꯅꯕꯤꯗꯨꯅꯥ ꯈꯪꯖꯤꯅꯕꯤꯌꯨ ꯃꯗꯨꯗꯤ ꯅꯦꯁ꯭ꯇꯦꯗ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯁꯄꯣꯔꯠ ꯇꯧꯗꯦ, ꯑꯃꯁꯨꯡ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯃꯍꯧꯁꯥꯅꯥ ꯑꯦꯛꯁꯦꯁꯤꯕꯤꯂꯤꯇꯤ ꯁ꯭ꯇꯦꯟꯗꯔꯗꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯗꯦ꯫

ꯑꯔꯣꯏꯕꯗꯥ, ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯁꯤ ꯁꯣꯔꯁꯇꯒꯤ ꯁꯦꯃꯒꯠꯂꯕꯗꯤ, ꯃꯁꯤꯗꯥutil.js .

ꯈꯨꯗꯝ

ꯀꯦꯔꯣꯁꯦꯂꯁꯤꯡꯅꯥ ꯁ꯭ꯂꯥꯏꯗ ꯗꯥꯏꯃꯦꯟꯁꯅꯁꯤꯡ ꯃꯁꯥ ꯃꯊꯟꯇꯥ ꯅꯣꯔꯃꯦꯂꯥꯏꯖ ꯇꯧꯗꯦ꯫ ꯑꯁꯤꯒꯨꯝꯕꯥ ꯃꯑꯣꯡꯗꯥ, ꯅꯍꯥꯛꯅꯥ ꯀꯟꯇꯦꯟꯇ ꯑꯗꯨ ꯃꯇꯤꯛ ꯆꯥꯅꯥ ꯁꯥꯏꯖ ꯇꯧꯅꯕꯥ ꯑꯍꯦꯅꯕꯥ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ ꯀꯁ꯭ꯇꯝ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯌꯥꯏ꯫ ꯀꯦꯔꯣꯁꯦꯂꯁꯤꯡꯅꯥ ꯃꯃꯥꯡꯒꯤ/ꯃꯊꯪꯒꯤ ꯀꯟꯠꯔꯣꯂꯁꯤꯡ ꯑꯃꯁꯨꯡ ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡ ꯁꯄꯣꯔꯠ ꯇꯧꯔꯕꯁꯨ, ꯃꯈꯣꯌ ꯑꯁꯤ ꯃꯌꯦꯛ ꯁꯦꯡꯅꯥ ꯃꯊꯧ ꯇꯥꯗꯦ꯫ ꯅꯍꯥꯛꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯀꯁ꯭ꯇꯃꯁ ꯇꯧꯕꯥ꯫

ꯀ꯭ꯂꯥꯁ .activeꯑꯗꯨ ꯁ꯭ꯂꯥꯏꯗ ꯑꯃꯗꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯏ ꯅꯠꯔꯕꯗꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯎꯕꯥ ꯐꯪꯂꯣꯏ꯫ ꯃꯁꯤꯗꯁꯨ ꯅꯠꯇꯅꯥ ꯑꯣꯄꯁꯅꯦꯜ ꯀꯟꯠꯔꯣꯂꯁꯤꯡꯒꯤꯗꯃꯛ ꯑꯈꯟꯅꯕꯥ ꯑꯃꯥ ꯁꯣꯏꯗꯅꯥ ꯁꯦꯠ ꯇꯧꯕꯤꯌꯨ id, .carouselꯃꯔꯨꯑꯣꯏꯅꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯄꯦꯖ ꯑꯃꯗꯥ ꯃꯁꯤꯡ ꯌꯥꯝꯂꯕꯥ ꯀꯦꯔꯣꯁꯤꯜꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ꯫ ꯀꯟꯠꯔꯣꯜ ꯑꯃꯁꯨꯡ ꯏꯟꯗꯤꯀꯦꯇꯔ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡꯗꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯃꯥ ( data-targetꯅꯠꯠꯔꯒꯥ hrefꯂꯤꯉ꯭ꯀꯁꯤꯡꯒꯤꯗꯃꯛꯇꯥ) ꯂꯩꯒꯗꯕꯅꯤ꯫id.carousel

ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡ ꯈꯛꯇꯃꯛ꯫

ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯁ꯭ꯂꯥꯏꯗ ꯈꯛꯇꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯃꯥ ꯌꯥꯑꯣꯔꯤ꯫ ꯕ꯭ꯔꯥꯎꯖꯔ ꯗꯤꯐꯣꯜꯇ ꯏꯃꯦꯖ ꯑꯦꯂꯥꯏꯅꯃꯦꯟꯇ ꯊꯤꯡꯅꯕꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯏꯃꯦꯖꯁꯤꯡꯗꯥ .d-blockꯑꯃꯁꯨꯡ ꯂꯩꯕꯥ ꯑꯗꯨ ꯅꯣꯠ ꯇꯧꯕꯤꯌꯨ꯫.w-100

<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
        <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
</div>

ꯀꯟꯠꯔꯣꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ꯫

ꯃꯃꯥꯡꯒꯤ ꯑꯃꯁꯨꯡ ꯃꯊꯪꯒꯤ ꯀꯟꯠꯔꯣꯂꯁꯤꯡꯗꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯑꯦꯂꯤꯃꯦꯟꯇꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯄꯥꯎꯇꯥꯛ ꯄꯤꯔꯤ , <button>ꯑꯗꯨꯕꯨ ꯅꯍꯥꯛꯅꯥ .<a>role="button"

<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
 <button class="carousel-control-prev" type="button" data-target="#carouselExampleControls" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleControls" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ꯫

ꯅꯍꯥꯛꯅꯥ ꯏꯟꯗꯤꯀꯦꯇꯔꯁꯤꯡ ꯑꯗꯨ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯗꯥ ꯍꯥꯄꯆꯤꯅꯕꯁꯨ ꯌꯥꯏ, ꯀꯟꯠꯔꯣꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ, ꯃꯗꯨꯁꯨ꯫

<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
  <ol class="carousel-indicators">
    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
    <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
  </ol>
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#carouselExampleIndicators" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleIndicators" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯀꯦꯄꯁꯅꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ꯫

.carousel-captionꯀꯔꯤꯒꯨꯝꯕꯥ ꯑꯃꯒꯤ ꯃꯅꯨꯡꯗꯥ ꯂꯩꯕꯥ ꯑꯦꯂꯤꯃꯦꯟꯇ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡꯗꯥ ꯀꯦꯄꯁꯅꯁꯤꯡ ꯐꯖꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ .carousel-item. ꯃꯈꯣꯌ ꯑꯁꯤ ꯃꯈꯥꯗꯥ ꯎꯠꯂꯤꯕꯥ ꯑꯁꯤꯒꯨꯝꯅꯥ ꯑꯄꯤꯀꯄꯥ ꯚꯤꯎꯄꯣꯔꯇꯁꯤꯡꯗꯥ ꯐꯖꯅꯥ ꯂꯣꯠꯄꯥ ꯌꯥꯏ, ꯃꯁꯤꯗꯥ ꯑꯣꯄꯁꯅꯦꯜ ꯗꯤꯁꯞꯂꯦ ꯌꯨꯇꯤꯂꯤꯇꯤꯁꯤꯡ ꯌꯥꯑꯣꯔꯤ . ꯑꯩꯈꯣꯌꯅꯥ ꯃꯈꯣꯌꯕꯨ ꯑꯍꯥꯅꯕꯗꯥ ꯂꯣꯠꯁꯤꯜꯂꯤ .d-noneꯑꯃꯁꯨꯡ ꯃꯈꯣꯌꯕꯨ .d-md-block.

<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
  <ol class="carousel-indicators">
    <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
    <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
  </ol>
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
      <div class="carousel-caption d-none d-md-block">
        <h5>First slide label</h5>
        <p>Some representative placeholder content for the first slide.</p>
      </div>
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
      <div class="carousel-caption d-none d-md-block">
        <h5>Second slide label</h5>
        <p>Some representative placeholder content for the second slide.</p>
      </div>
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
      <div class="carousel-caption d-none d-md-block">
        <h5>Third slide label</h5>
        <p>Some representative placeholder content for the third slide.</p>
      </div>
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#carouselExampleCaptions" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleCaptions" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯀ꯭ꯔꯣꯁꯐꯦꯗ ꯇꯧꯕꯥ꯫

.carousel-fadeꯁ꯭ꯂꯥꯏꯗ ꯑꯃꯒꯤ ꯃꯍꯨꯠꯇꯥ ꯐꯦꯗ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡ ꯑꯦꯅꯤꯃꯦꯠ ꯇꯧꯅꯕꯥ ꯅꯍꯥꯛꯀꯤ ꯀꯦꯔꯣꯁꯦꯂꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯅꯍꯥꯛꯀꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯀꯟꯇꯦꯟꯇꯀꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ, ꯇꯦꯛꯁꯠ ꯈꯛꯇꯒꯤ ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡ), ꯅꯍꯥꯛꯅꯥ ꯃꯑꯣꯡ ꯆꯨꯝꯅꯥ ꯀ꯭ꯔꯣꯁꯐꯦꯗꯤꯡ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ s ꯗꯥ .bg-bodyꯅꯠꯠꯔꯒꯥ ꯀꯁ꯭ꯇꯝ CSS ꯈꯔꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯄꯥꯝꯂꯕꯁꯨ ꯌꯥꯏ꯫.carousel-item

<div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#carouselExampleFade" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleFade" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯃꯊꯪꯒꯤ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨꯗꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯁꯥꯏꯛꯂꯤꯡ ꯇꯧꯕꯒꯤ ꯃꯔꯛꯇꯥ ꯊꯦꯡꯊꯕꯒꯤ ꯃꯇꯃꯒꯤ ꯆꯥꯡ ꯑꯗꯨ ꯍꯣꯡꯗꯣꯛꯅꯕꯥ data-interval=""aꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫.carousel-item

<div id="carouselExampleInterval" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active" data-interval="10000">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item" data-interval="2000">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#carouselExampleInterval" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleInterval" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯇꯆ ꯁꯣꯏꯄꯤꯡ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯔꯣ꯫

ꯀꯦꯔꯣꯁꯦꯂꯁꯤꯡꯅꯥ ꯁ꯭ꯂꯥꯏꯗꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯆꯠꯊꯣꯛ-ꯆꯠꯁꯤꯟ ꯇꯧꯅꯕꯥ ꯇꯥꯆꯁ꯭ꯛꯔꯤꯟ ꯗꯤꯚꯥꯏꯁꯁꯤꯡꯗꯥ ꯂꯦꯞꯇꯅꯥ/ꯑꯔꯥꯞꯄꯥ ꯁꯣꯏꯞ ꯇꯧꯕꯗꯥ ꯃꯇꯦꯡ ꯄꯥꯡꯏ꯫ data-touchꯃꯁꯤ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯗꯤꯁꯦꯕꯜ ꯇꯧꯕꯥ ꯌꯥꯏ꯫ data-rideꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯈꯨꯗꯝ ꯑꯁꯤꯅꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯁꯤꯁꯨ ꯌꯥꯑꯣꯗꯦ ꯑꯃꯁꯨꯡ ꯂꯩꯔꯤ data-interval="false"ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯃꯁꯤꯅꯥ ꯑꯣꯇꯣꯞꯂꯦ ꯇꯧꯗꯦ꯫

<div id="carouselExampleControlsNoTouching" class="carousel slide" data-touch="false" data-interval="false">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#carouselExampleControlsNoTouching" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#carouselExampleControlsNoTouching" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>

ꯁꯤꯖꯤꯟꯅꯕꯥ꯫

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

ꯀꯦꯔꯣꯁꯦꯂꯒꯤ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ ꯐꯖꯅꯥ ꯀꯟꯠꯔꯣꯜ ꯇꯧꯅꯕꯥ ꯗꯦꯇꯥ ꯑꯦꯠꯔꯤꯕꯤꯎꯇꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯧ꯫ ꯀꯤ-ꯋꯥꯔꯗꯁꯤꯡ ꯅꯠꯠꯔꯒꯥ , data-slideꯑꯁꯤ ꯌꯥꯔꯦ , ꯃꯁꯤꯅꯥ ꯃꯁꯤꯒꯤ ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯄꯣꯖꯤꯁꯟ ꯑꯁꯤꯒꯥ ꯆꯥꯡꯗꯝꯅꯕꯗꯥ ꯁ꯭ꯂꯥꯏꯗꯀꯤ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ ꯍꯣꯡꯗꯣꯀꯏ꯫ ꯅꯠꯠꯔꯒꯥ, ꯀꯦꯔꯣꯁꯦꯂꯗꯥ ꯔꯣ ꯁ꯭ꯂꯥꯏꯗ ꯏꯟꯗꯦꯛꯁ ꯑꯃꯥ ꯄꯥꯁ ꯇꯧꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯧ , ꯃꯁꯤꯅꯥ ꯁ꯭ꯂꯥꯏꯗꯀꯤ ꯄꯣꯖꯤꯁꯟ ꯑꯗꯨ .prevnextdata-slide-todata-slide-to="2"0

ꯑꯦꯠꯔꯤꯕꯤꯎꯠ ꯑꯁꯤ data-ride="carousel"ꯄꯦꯖ ꯂꯣꯗꯇꯒꯤ ꯍꯧꯔꯒꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯃꯥ ꯑꯦꯅꯤꯃꯦꯇꯦꯗ ꯑꯣꯏꯅꯥ ꯃꯥꯔꯛ ꯇꯧꯕꯗꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯕꯗꯥ ꯁꯤꯖꯤꯟꯅꯗ꯭ꯔꯕꯗꯤ data-ride="carousel", ꯅꯍꯥꯛꯅꯥ ꯃꯁꯥꯅꯥ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯒꯗꯕꯅꯤ꯫ ꯃꯁꯤ ꯆꯞ ꯃꯥꯟꯅꯕꯥ ꯀꯦꯔꯣꯁꯦꯂꯒꯤ (ꯔꯤꯗꯟꯗꯦꯟꯇ ꯑꯃꯁꯨꯡ ꯃꯊꯧ ꯇꯥꯗꯕꯥ) ꯃꯌꯦꯛ ꯁꯦꯡꯕꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖꯦꯁꯅꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯗꯦ꯫

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

ꯀꯦꯔꯣꯁꯤꯜ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯀꯜ ꯇꯧꯕꯤꯌꯨ:

$('.carousel').carousel()

ꯑꯣꯄꯁꯅꯁꯤꯡ ꯂꯩ꯫

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

ꯃꯤꯡ ꯃꯈꯜ ꯀꯥꯡꯂꯣꯟ ꯏꯟꯗꯕ ꯋꯥꯔꯣꯜ
ꯏꯟꯇꯔꯚꯜ ꯇꯧꯕꯥ꯫ ꯃꯁꯤꯡ ꯵꯰꯰꯰ ꯄꯤꯈꯤ꯫ ꯑꯥꯏꯇꯦꯝ ꯑꯃꯕꯨ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯁꯥꯏꯀꯜ ꯊꯧꯕꯒꯤ ꯃꯔꯛꯇꯥ ꯊꯦꯡꯊꯒꯗꯕꯥ ꯃꯇꯃꯒꯤ ꯆꯥꯡ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ false, ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯃꯁꯥ ꯃꯊꯟꯇꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯔꯣꯏ꯫
ꯀꯤꯕꯣꯔꯗ꯫ ꯕꯨꯂꯦꯅꯒꯤ ꯑꯣꯏꯕꯥ꯫ ꯑꯆꯨꯝꯕ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯅꯥ ꯀꯤꯕꯣꯔꯗꯀꯤ ꯊꯧꯗꯣꯀꯁꯤꯡꯗꯥ ꯔꯤꯑꯦꯛꯇ ꯇꯧꯒꯗ꯭ꯔꯥ ꯍꯥꯌꯕꯗꯨ꯫
ꯉꯩꯍꯥꯛ ꯂꯦꯞꯄ ꯁ꯭ꯠꯔꯤꯡ | ꯕꯨꯂꯦꯅꯒꯤ ꯑꯣꯏꯕꯥ꯫ ‘ꯍꯣꯚꯔ’ ꯇꯧꯕꯥ꯫

ꯀꯔꯤꯒꯨꯝꯕꯥ ꯁꯦꯠ ꯇꯧꯔꯕꯗꯤ 'hover', ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯒꯤ ꯁꯥꯏꯛꯂꯤꯡ ꯑꯗꯨ ꯑꯣꯟꯊꯣꯀꯏ mouseenterꯑꯃꯁꯨꯡ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯒꯤ ꯁꯥꯏꯛꯂꯤꯡ ꯑꯗꯨ ꯑꯣꯟ mouseleave. ꯀꯔꯤꯒꯨꯝꯕꯥ ,ꯗꯥ ꯁꯦꯠ ꯇꯧꯔꯕꯗꯤ false, ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯒꯤ ꯃꯊꯛꯇꯥ ꯍꯣꯚꯔ ꯇꯧꯕꯅꯥ ꯃꯗꯨ ꯊꯤꯡꯖꯤꯜꯂꯣꯏ꯫

ꯇꯆ-ꯏꯅꯦꯕꯜ ꯗꯤꯚꯥꯏꯁꯁꯤꯡꯗꯥ, ꯗꯥ ꯁꯦꯠ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ 'hover', ꯁꯥꯏꯛꯂꯤꯡ ꯑꯁꯤ touchendꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯑꯃꯨꯛ ꯍꯟꯅꯥ ꯍꯧꯗ꯭ꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ, ꯏꯟꯇꯔꯚꯦꯜ ꯑꯅꯤꯒꯤ ꯑꯣꯏꯅꯥ (ꯌꯨꯖꯔ ꯑꯗꯨꯅꯥ ꯀꯦꯔꯣꯁꯦꯂꯒꯥ ꯏꯟꯇꯔꯦꯛꯇ ꯇꯧꯕꯥ ꯂꯣꯌꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ) ꯊꯃꯒꯅꯤ꯫ ꯃꯁꯤ ꯃꯊꯛꯇꯥ ꯄꯅꯈ꯭ꯔꯤꯕꯥ ꯃꯥꯎꯁꯀꯤ ꯂꯃꯆꯠ-ꯁꯥꯖꯠ ꯑꯁꯤꯒꯤ ꯃꯊꯛꯇꯥ ꯂꯩ ꯍꯥꯌꯕꯁꯤ ꯈꯪꯖꯤꯅꯕꯤꯌꯨ꯫
ꯊꯣꯕ ꯄꯔꯦꯡ ꯑꯔꯥꯟꯕ ꯌꯨꯖꯔꯅꯥ ꯑꯍꯥꯅꯕꯥ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯑꯣꯇꯣꯞꯂꯦ ꯇꯧꯏ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ,ꯗꯥ ꯁꯦꯠ ꯇꯧꯔꯕꯗꯤ 'carousel', ꯂꯣꯗ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯑꯣꯇꯣꯞꯂꯦ ꯇꯧꯏ꯫
ꯌꯣꯝꯕ ꯕꯨꯂꯦꯅꯒꯤ ꯑꯣꯏꯕꯥ꯫ ꯑꯆꯨꯝꯕ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯂꯦꯞꯇꯅꯥ ꯁꯥꯏꯀꯜ ꯊꯧꯒꯗ꯭ꯔꯥ ꯅꯠꯠꯔꯒꯥ ꯍꯥꯔꯗ ꯁ꯭ꯇꯣꯞ ꯂꯩꯒꯗ꯭ꯔꯥ ꯍꯥꯌꯕꯗꯨ꯫
ꯊꯦꯡꯕꯥꯡ ꯕꯨꯂꯦꯅꯒꯤ ꯑꯣꯏꯕꯥ꯫ ꯑꯆꯨꯝꯕ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯅꯥ ꯇꯆꯁ꯭ꯛꯔꯤꯟ ꯗꯤꯚꯥꯏꯁꯁꯤꯡꯗꯥ ꯂꯦꯞꯇꯅꯥ/ꯔꯥꯏꯠ ꯁ꯭ꯕꯥꯏꯞ ꯏꯟꯇꯔꯦꯛꯁꯅꯁꯤꯡ ꯁꯄꯣꯔꯠ ꯇꯧꯒꯗ꯭ꯔꯥ ꯍꯥꯌꯕꯗꯨ꯫

ꯄꯥꯝꯕꯩꯁꯤꯡ꯫

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

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

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

.carousel(options)

ꯑꯣꯄꯁꯅꯦꯜ ꯑꯣꯄꯁꯟ ꯑꯃꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯏ objectꯑꯃꯁꯨꯡ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯕꯥ ꯍꯧꯏ꯫

$('.carousel').carousel({
  interval: 2000
})

.carousel('cycle')

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯃꯔꯛꯇꯥ ꯂꯦꯃꯍꯧꯔꯤꯕꯥ ꯑꯗꯨꯗꯒꯤ ꯑꯔꯣꯏꯕꯥ ꯐꯥꯑꯣꯕꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ꯫

.carousel('pause')

ꯑꯥꯏꯇꯦꯃꯁꯤꯡꯒꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯁꯤ ꯁꯥꯏꯀꯜ ꯊꯧꯕꯗꯒꯤ ꯊꯤꯡꯏ꯫

.carousel(number)

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯑꯀꯛꯅꯕꯥ ꯐ꯭ꯔꯦꯝ ꯑꯃꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ (0ꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ, ꯑꯦꯔꯦ ꯑꯃꯒꯥ ꯃꯥꯟꯅꯕꯥ)꯫ ꯇꯥꯔꯒꯦꯠ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨ ꯎꯠꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ slid.bs.carouselꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯜ ꯇꯧꯔꯤꯕꯥ ꯃꯤꯑꯣꯏ ꯑꯗꯨꯗꯥ ꯍꯜꯂꯀꯏ꯫

.carousel('prev')

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

.carousel('next')

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

.carousel('dispose')

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

.carousel('nextWhenVisible')

ꯄꯦꯖ ꯑꯗꯨ ꯎꯕꯥ ꯐꯪꯗꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯅꯠꯠꯔꯒꯥ ꯃꯁꯤꯒꯤ ꯃꯃꯥ-ꯃꯄꯥ ꯑꯗꯨ ꯎꯕꯥ ꯐꯪꯗꯕꯥ ꯃꯇꯃꯗꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯃꯊꯪꯒꯤ ꯃꯐꯃꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯒꯅꯨ꯫ ꯃꯊꯪꯒꯤ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨ ꯎꯠꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ slid.bs.carouselꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯜ ꯇꯧꯔꯤꯕꯥ ꯃꯤꯑꯣꯏ ꯑꯗꯨꯗꯥ ꯍꯜꯂꯀꯏ꯫

.carousel('to')

ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨ ꯑꯀꯛꯅꯕꯥ ꯐ꯭ꯔꯦꯝ ꯑꯃꯗꯥ ꯁꯥꯏꯀꯜ ꯇꯧꯏ (0ꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯥ, ꯑꯦꯔꯦ ꯑꯃꯒꯥ ꯃꯥꯟꯅꯕꯥ)꯫ ꯃꯊꯪꯒꯤ ꯑꯥꯏꯇꯦꯝ ꯑꯗꯨ ꯎꯠꯂꯕꯥ ꯃꯇꯨꯡꯗꯥ (ꯑꯔꯕꯥꯟ slid.bs.carouselꯊꯧꯗꯣꯛ ꯑꯗꯨ ꯊꯣꯛꯂꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ) ꯀꯣꯜ ꯇꯧꯔꯤꯕꯥ ꯃꯤꯑꯣꯏ ꯑꯗꯨꯗꯥ ꯍꯜꯂꯀꯏ꯫

ꯊꯧꯔꯃꯁꯤꯡ꯫

ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯀ꯭ꯂꯥꯁ ꯑꯁꯤꯅꯥ ꯀꯦꯔꯣꯁꯤꯜ ꯐꯉ꯭ꯀꯁꯅꯦꯂꯤꯇꯤꯗꯥ ꯍꯨꯛ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ ꯊꯧꯗꯣꯛ ꯑꯅꯤ ꯐꯣꯡꯗꯣꯛꯂꯤ꯫ ꯊꯧꯔꯝ ꯑꯅꯤꯃꯛꯇꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯍꯦꯅꯕꯥ ꯃꯒꯨꯅꯁꯤꯡ ꯑꯁꯤ ꯂꯩꯔꯤ:

  • direction: ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯅꯥ ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯔꯤꯕꯥ ꯃꯥꯌꯀꯩ ꯑꯗꯨ (ꯅꯠꯔꯒꯥ "left"ꯅꯠꯠꯔꯒꯥ "right")꯫
  • relatedTarget: ꯑꯦꯛꯇꯤꯕ ꯑꯥꯏꯇꯦꯝ ꯑꯣꯏꯅꯥ ꯃꯐꯝ ꯑꯗꯨꯗꯥ ꯁ꯭ꯂꯥꯏꯗ ꯇꯧꯔꯤꯕꯥ ꯗꯤ.ꯑꯣ.ꯑꯦꯝ.
  • from: ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯑꯥꯏꯇꯦꯝ ꯑꯁꯤꯒꯤ ꯏꯟꯗꯦꯛꯁ꯫
  • to: ꯃꯊꯪꯒꯤ ꯑꯥꯏꯇꯦꯃꯒꯤ ꯏꯟꯗꯦꯛꯁ꯫

ꯀꯦꯔꯣꯁꯤꯜ ꯊꯧꯗꯣꯛ ꯄꯨꯝꯅꯃꯛ ꯀꯦꯔꯣꯁꯤꯜ ꯃꯁꯥꯃꯛꯇꯗꯥ (ꯑꯔꯕꯥꯟ <div class="carousel">) ꯐꯥꯏꯔ ꯇꯧꯏ꯫

ꯏꯚꯦꯟꯇ ꯃꯈꯜ꯫ ꯋꯥꯔꯣꯜ
ꯁ꯭ꯂꯥꯏꯗ.ꯕꯤ.ꯑꯦꯁ.ꯀꯦꯔꯣꯁꯤꯜ ꯇꯧꯕꯥ꯫ slideꯏꯟꯁꯇꯦꯟꯁ ꯃꯦꯊꯗ ꯑꯗꯨ ꯏꯅꯚꯣꯛ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯏꯚꯦꯟꯇ ꯑꯁꯤ ꯈꯨꯗꯛꯇꯥ ꯐꯥꯏꯔ ꯇꯧꯏ꯫
ꯁ꯭ꯂꯥꯏꯗ.ꯕꯤ.ꯑꯦꯁ.ꯀꯦꯔꯣꯁꯤꯜ ꯇꯧꯕꯥ꯫ ꯊꯧꯔꯝ ꯑꯁꯤ ꯀꯦꯔꯣꯁꯤꯜ ꯑꯗꯨꯅꯥ ꯃꯁꯥꯒꯤ ꯁ꯭ꯂꯥꯏꯗ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯑꯗꯨ ꯂꯣꯏꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ ꯐꯥꯏꯔ ꯇꯧꯏ꯫ 
$('#myCarousel').on('slide.bs.carousel', function () {
  // do something...
})

ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯒꯤ ꯃꯇꯝ ꯍꯣꯡꯗꯣꯀꯄꯥ꯫

ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯒꯤ ꯃꯇꯝ ꯑꯁꯤ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯗ꯭ꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ ꯁꯥꯁ ꯚꯦꯔꯤꯑꯦꯕꯂꯒꯥ .carousel-itemꯂꯣꯌꯅꯅꯥ ꯍꯣꯡꯗꯣꯀꯄꯥ ꯌꯥꯏ $carousel-transitionꯅꯠꯠꯔꯒꯥ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ CSS ꯁꯤꯖꯤꯟꯅꯔꯕꯗꯤ ꯀꯁ꯭ꯇꯝ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡꯒꯥ ꯂꯣꯌꯅꯅꯥ ꯍꯣꯡꯗꯣꯀꯄꯥ ꯌꯥꯏ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯃꯜꯇꯤꯄꯜ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯅꯁꯤꯡ ꯑꯦꯞꯂꯥꯏ ꯇꯧꯔꯕꯗꯤ, ꯇ꯭ꯔꯥꯟꯁꯐꯣꯔꯝ ꯇ꯭ꯔꯥꯟꯁꯤꯁꯟ ꯑꯗꯨ ꯑꯍꯥꯅꯕꯗꯥ ꯗꯤꯐꯥꯏꯟ ꯇꯧꯔꯦ ꯍꯥꯌꯕꯥ ꯁꯣꯌꯗꯅꯥ ꯈꯪꯗꯣꯀꯎ (ꯈꯨꯗꯝ ꯑꯣꯏꯅꯥ transition: transform 2s ease, opacity .5s ease-out)꯫