Source

Okulabula

Okuwa obubaka obukwata ku nsonga ku bikolwa eby’abakozesa ebya bulijjo n’obubaka obutonotono obuliwo era obukyukakyuka obw’okulabula.

Eby’okulabirako

Okulabula kuliwo ku buwanvu bwonna obw’ekiwandiiko, wamu ne bbaatuuni y’okugoba ey’okwesalirawo. Okusobola okukola sitayiro entuufu, kozesa emu ku kiraasi munaana ezeetaagisa.alert-success ez’embeera (okugeza, ). Ku lw'okugobwa mu layini, kozesa alerts jQuery plugin .

<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>
Okutuusa amakulu mu tekinologiya ayamba

Okukozesa langi okwongera amakulu kiwa ekiraga ekirabika kyokka, ekitajja kutuusibwa eri abakozesa tekinologiya ayamba – gamba ng’ebisoma ku ssirini. Kakasa nti amawulire agalagirwa langi oba geeyoleka okuva mu birimu byennyini (okugeza ekiwandiiko ekirabika), oba gateekebwamu okuyita mu ngeri endala, gamba ng’ebiwandiiko ebirala ebikwekebwa ne .sr-onlykiraasi.

Kozesa ekibiina .alert-linkky'omugaso okuwa amangu enkolagana za langi ezikwatagana munda mu kulabula kwonna.

<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>

Ebirimu ebirala

Okulabula era kuyinza okubaamu ebintu ebirala ebya HTML nga emitwe, obutundu n’ebigabanya.

<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>

Okugoba

Nga okozesa enkola ya JavaScript ey'okulabula, kisoboka okugoba okulabula kwonna mu layini. Laba engeri gye tulabamu:

  • Kakasa nti otikkidde plugin y'okulabula, oba Bootstrap JavaScript ekung'aanyiziddwa.
  • Bw'oba ozimba JavaScript yaffe okuva ku nsibuko, kyetaagisautil.js . Enkyusa ekuŋŋaanyiziddwa erimu kino.
  • Okwongerako bbaatuuni y’okugoba ne .alert-dismissiblekiraasi, ekyongerako padding ey’enjawulo ku ddyo w’okulabula n’okuteeka .closebbaatuuni.
  • Ku bbaatuuni y'okugoba, yongera ku kintu data-dismiss="alert", ekivaako enkola ya JavaScript. Kakasa nti okozesa <button>elementi nayo okusobola okweyisa obulungi mu byuma byonna.
  • Okukola animmate alerts nga ozigoba, kakasa nti ogattako .fadene .showclasses.

Kino osobola okukiraba mu bikolwa ng’okozesa live demo:

<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>

Enneeyisa ya JavaScript

Ebivaako amaanyi

Ssobozesa okugoba okulabula ng'oyita mu JavaScript:

$('.alert').alert()

Oba datan'ebintu ku bbaatuuni munda mu kulabula , nga bwe kiragibwa waggulu:

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

Weetegereze nti okuggalawo okulabula kijja kukiggya mu DOM.

Enkola

Engeri Okunnyonnyola
$().alert() Ekola okulabula okuwuliriza ebibaawo mu kunyiga ku elementi z’ezzadde ezirina data-dismiss="alert"attribute. (Tekyetaagisa nga okozesa data-api's auto-initialization.)
$().alert('close') Eggalawo okulabula ng'akuggya mu DOM. Singa .fadene .showclasses zibeerawo ku elementi, okulabula kujja kuzikira nga tekunnaggyibwawo.
$().alert('dispose') Esaanyaawo okulabula kwa elementi. 
$('.alert').alert('close')

Ebibaddewo

Bootstrap's alert plugin eraga ebitonotono ebibaawo olw'okuyunga mu nkola y'okulabula.

Omukolo Okunnyonnyola
close.bs.alert Ekintu kino kikuba amangu ddala nga closeenkola ya instance eyitiddwa.
closed.bs.alert Ekintu kino kikubwa nga okulabula kuggaddwa (kijja kulinda enkyukakyuka za CSS okuggwa). 
$('#myAlert').on('closed.bs.alert', function () {
  // do something...
})