Kɔlɔsiliw
Aw bɛ kunnafoni cikanw di sigida kɔnɔ baarakɛlaw ka walew danmadɔw kama ni lasɔmini cikan damadɔw ye minnu bɛ sɔrɔ ani minnu bɛ se ka wuli ka bɔ u nɔ na.
Misaliw
Kɔlɔsiliw bɛ sɔrɔ sɛbɛnni janya o sɛbɛn janya kan, ani butɔni min bɛ se ka kɛ ka bɔ baara la. Walasa ka cogoya ɲuman sɔrɔ, aw bɛ baara kɛ ni sigida kalansen 8 wajibiyalenw dɔ ye (misali la, .alert-success
). Walasa ka inline dismissing kɛ, baara kɛ ni alerts jQuery plugin ye .
<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>
Kɔrɔ lasecogo dɛmɛni fɛɛrɛw ma
Baara kɛli ni kulɛri ye walasa ka kɔrɔ fara a kan, o bɛ taamasiyɛn yelen dɔrɔn de di, min tɛna lase dɛmɛni fɛɛrɛw baarakɛlaw ma – i n’a fɔ ɛkran kalanbagaw. Aw ye aw jija kunnafoni minnu jiralen don ni kulɛri ye, olu bɛ ye ka bɔ kɔnɔkow yɛrɛ la (misali la sɛbɛn yelen), walima u bɛ don a kɔnɔ fɛɛrɛ wɛrɛw fɛ, i n’a fɔ sɛbɛn wɛrɛw minnu dogolen don ni .sr-only
kalan ye.
Link kulɛri
Baara kɛ ni .alert-link
utilité class ye walasa ka teliya ka jɛgɛnsira kulɛriw di minnu bɛ bɛn ɲɔgɔn ma lasɔmini o lasɔmini kɔnɔ.
<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>
Kɔnɔkow wɛrɛw
Kɔlɔsiliw fana bɛ Se ka HTML fɛn wɛrɛw Sɔrɔ i n’a fɔ dakunw, dakunw ani tilayɔrɔbaw.
A ɲɛna!
Aww yeah, i ye nin lasɔmini cikan nafama in kalan ka ɲɛ. Nin misali sɛbɛn in bɛna boli dɔɔnin walasa aw k’a ye cogo min na yɔrɔjan min bɛ lasɔmini kɔnɔ, o bɛ baara kɛ ni nin kɔnɔko sugu in ye.
Tuma o tuma ni aw mago bɛ o la, aw ye aw jija ka baara kɛ ni margin utilities ye walasa ka fɛnw kɛ ka ɲɛ ani ka u labɛn ka ɲɛ.
<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>
Ka bɔ baara la
Baara kɛli ni JavaScript plugin ye min bɛ wele ko alert, a bɛ se ka kɛ ka alert o lasɔmini in bila kɛnɛ kan. A kɛcogo filɛ nin ye:
- Aw ye aw jija ka alert plugin doni, walima Bootstrap JavaScript min labɛnna.
- N'i bɛ an ka JavaScript jɔ ka bɔ source la, a bɛ wajibiya
util.js
. O sɛbɛn in kɔnɔko min labɛnna, o bɛ o de la. - Aw bɛ butɔni dɔ fara a kan min bɛ bɔli kɛ ani
.alert-dismissible
kalan, o bɛ dɔ fara padding kan ka taa alert kinin fɛ ani ka.close
butɔni bila yɔrɔ la. - Dismiss button kan,
data-dismiss="alert"
attribute fara a kan, o min bɛ JavaScript baarakɛcogo daminɛ. Aw ye aw jija ka baara kɛ ni<button>
element ye n’a ye walasa ka taamacogo ɲuman sɔrɔ minɛnw bɛɛ kɔnɔ. - Walasa ka lasɔminiw ɲɛnamaya ni aw bɛ u bila ka taa, aw ye aw jija ka
.fade
ani.show
kalanw fara a kan.
Aw bɛ se k’o ye wale la ni demo ɲɛnama ye:
<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">×</span>
</button>
</div>
JavaScript kɛcogo
Fɛn minnu bɛ mɔgɔ bila ka baara kɛ
A’ ye lasɔmini dɔ bilali daminɛ JavaScript fɛ:
$('.alert').alert()
Walima ni data
fɛnw ye butɔni dɔ kan lasɔmini kɔnɔ , i n’a fɔ a jiralen bɛ cogo min na sanfɛ:
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
A kɔlɔsi ko ni i ye lasɔmini dɔ datugu, o bɛna a bɔ DOM kɔnɔ.
Fɛɛrɛw
Kɛcogo | Cogojirali |
---|---|
$().alert() |
A bɛ lasɔmini Kɛ ka 'kùnnafoni-cimago-ko kɛlenw Lamɛ bɔnsɔn-fɛnw kan minnu bɛ ni data-dismiss="alert" fɛnɲɛnɛma ye. (A man kan ni baara bɛ kɛ ni data-api ka auto-initialisation ye.) |
$().alert('close') |
A bɛ lasɔmini dɔ datugu ni a bɔli ye DOM kɔnɔ. Ni .fade and .show classes bɛ element kan, alert bɛ ban sani a ka bɔ. |
$().alert('dispose') |
A bɛ element dɔ ka alert tiɲɛ. |
$('.alert').alert('close')
Ko minnu kɛra
Bootstrap ka lasɔmini-plugin bɛ ko damadɔw Bɔ kɛnɛ kan walasa ka jɛgɛn ka Kɛ lasɔmini baarakɛcogo la.
Lajɛrɛ | Cogojirali |
---|---|
close.bs.alert |
O ko in bɛ tasuma Bɔ o yɔrɔnin bɛɛ ni close misali fɛɛrɛ Weelela. |
closed.bs.alert |
Nin ko in bɛ Fɔ ni lasɔmini Dafara (a bɛna CSS 'tɛmɛsiraw makɔnɔ u ka ban). |
$('#myAlert').on('closed.bs.alert', function () {
// do something...
})