Source

Akeekkachiisa

Ergaawwan yaada yaada haalaa gochoota fayyadamaa idileedhaaf ergaawwan akeekkachiisaa harka muraasa jiran fi jijjiiramaa ta'an waliin kenni.

Fakkeenyaaf

Akeekkachiisni dheerina barruu kamiifuu ni argama, akkasumas qaree filannoo kuffisuu. Akkaataa sirrii ta'eef, gita haalata saddeet barbaachisan keessaa tokko fayyadami (fkn, .alert-success). Sarara keessaa hojii irraa ari'uuf, akeekkachiisa jQuery plugin fayyadami .

<div class="alert alert-primary" role="alert">
  A simple primary alert—check it out!
</div>
<div class="alert alert-secondary" role="alert">
  A simple secondary alert—check it out!
</div>
<div class="alert alert-success" role="alert">
  A simple success alert—check it out!
</div>
<div class="alert alert-danger" role="alert">
  A simple danger alert—check it out!
</div>
<div class="alert alert-warning" role="alert">
  A simple warning alert—check it out!
</div>
<div class="alert alert-info" role="alert">
  A simple info alert—check it out!
</div>
<div class="alert alert-light" role="alert">
  A simple light alert—check it out!
</div>
<div class="alert alert-dark" role="alert">
  A simple dark alert—check it out!
</div>
Teeknooloojiiwwan gargaaraa ta’aniif hiika dabarsuu

Hiika dabaluudhaaf halluu fayyadamuun agarsiisa mul’ataa qofa kenna, kunis fayyadamtoota teeknooloojiiwwan gargaarsaa – kan akka dubbistoota iskiriinii – hin dabarfamu. Odeeffannoon halluudhaan agarsiifame qabiyyee mataa isaa irraa ifa ta'uu isaa mirkaneessi (fkn barruu mul'atu), ykn karaa filannootiin hammatamuu isaa, kan akka barruu dabalataa .sr-onlygita waliin dhokatee.

.alert-linkAkeekkachiisa kamiyyuu keessaa walitti hidhamiinsa halluu walsimsiisu saffisaan kennuudhaaf gita faayidaa fayyadami .

<div class="alert alert-primary" role="alert">
  A simple primary alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-secondary" role="alert">
  A simple secondary alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-success" role="alert">
  A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-danger" role="alert">
  A simple danger alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-warning" role="alert">
  A simple warning alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-info" role="alert">
  A simple info alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-light" role="alert">
  A simple light alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
<div class="alert alert-dark" role="alert">
  A simple dark alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>

Qabiyyee dabalataa

Akeekkachiisni qaamolee HTML dabalataa kan akka mataduree, keewwataa fi qoqqoodduus qabaachuu danda'a.

<div class="alert alert-success" role="alert">
  <h4 class="alert-heading">Well done!</h4>
  <p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p>
  <hr>
  <p class="mb-0">Whenever you need to, be sure to use margin utilities to keep things nice and tidy.</p>
</div>

Hojii irraa ari'uu

Ijaarsa JaavaScript akeekkachiisaa fayyadamuun, akeekkachiisa kamiyyuu sarara keessaa kuffisuun ni danda'ama. Akkamitti akka ta'e kunooti:

  • Ijaarsa akeekkachiisaa, ykn JaavaScript Bootstrap qindaa'e fe'uu kee mirkaneessi.
  • Yoo JavaScriptutil.js keenya madda irraa ijaaraa jirta ta'e, . Version qindaa'e kana of keessaa qaba.
  • Qabduu hojii irraa ari'uu fi .alert-dismissiblegita dabali, kunis padding dabalataa gara mirga akeekkachiisaatti dabalee .closeqaree iddoo kaa'a.
  • Qabduu ari'uu irratti, data-dismiss="alert"amalli itti dabali, kunis dalagaa JaavaScript kakaasa. <button>Meeshaalee hunda irratti amala sirrii ta'eef elementii isa waliin fayyadamuu kee mirkaneessi .
  • Yeroo isaan kuffiftu akeekkachiisa sochoosuuf, gitaalee .fadefi dabaluu kee mirkaneessi..show

Kana hojiidhaan demoo kallattiin arguu dandeessu:

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>

Amala JaavaScript

Kaka’umsa

Karaa JaavaScript akeekkachiisa kuffisuu dandeessisi:

$('.alert').alert()

Yookiin dataamaloota qaree irratti akeekkachiisa keessa jiran waliin , akkuma armaan olitti agarsiifame:

<button type="button" class="close" data-dismiss="alert" aria-label="Close">
  <span aria-hidden="true">&times;</span>
</button>

Hubadhu, akeekkachiisa cufuun DOM irraa akka haqamu.

Malawwan

Mala Ibsa
$().alert() Akeekkachiisa taateewwan cuqaasuu qaamolee sanyii kanneen data-dismiss="alert"amaloota qaban irratti dhaggeeffatu taasisa. (Yeroo ofumaan jalqabuu data-api fayyadamtu barbaachisaa miti.)
$().alert('close') Akeekkachiisa DOM irraa haquudhaan cufa. Yoo gitaaleen .fadefi .showelementii irratti argaman, akeekkachiisni osoo hin haqamin dura ni bada.
$().alert('dispose') Akeekkachiisa elementii tokkoo ni balleessa. 
$(".alert").alert('close')

Taateewwan

Bootstrap's alert plugin taateewwan muraasa gara dalagaa akeekkachiisaatti hooking gochuuf saaxila.

Taatee Ibsa
close.bs.alert Taatee kun yeroo closemala fakkeenyaa waamamu battalumatti dhukaasa.
closed.bs.alert Taatee kun yeroo akeekkachiisni cufame ni dhukaafama (ce'umsa CSS xumuruuf ni eega). 
$('#myAlert').on('closed.bs.alert', function () {
  // do something…
})