JavaScript a ɛwɔ hɔ no
Fa Bootstrap no afã horow no ba nkwa mu denam jQuery plugins a wɔahyɛ da ayɛ bɛboro dumien so. Fa wɔn nyinaa ka ho ntɛm, anaasɛ mmiako mmiako.
Fa Bootstrap no afã horow no ba nkwa mu denam jQuery plugins a wɔahyɛ da ayɛ bɛboro dumien so. Fa wɔn nyinaa ka ho ntɛm, anaasɛ mmiako mmiako.
Wobetumi de plugins aka ho mmiako mmiako (de Bootstrap no ankorankoro *.js
fael ahorow bedi dwuma), anaasɛ ne nyinaa prɛko pɛ (de adi dwuma bootstrap.js
anaasɛ wɔayɛ no ketewaa no bootstrap.min.js
).
Ne nyinaa bootstrap.js
na bootstrap.min.js
ɛwɔ plugins nyinaa wɔ fael biako mu. Fa biako pɛ ka ho.
Plugin ne CSS afã horow bi gyina plugins afoforo so. Sɛ wode plugins ka ho mmiako mmiako a, hwɛ hu sɛ wobɛhwɛ saa dependencies yi wɔ docs no mu. Afei nso hyɛ no nsow sɛ plugins nyinaa gyina jQuery so (eyi kyerɛ sɛ ɛsɛ sɛ wɔde jQuery ka ho ansa na plugin fael ahorow no aba). Hwɛ yɛnbower.json
na hwɛ jQuery nkyerɛase ahorow a wɔboa.
Wubetumi de Bootstrap plugins nyinaa adi dwuma denam markup API no so ara kwa a worenkyerɛw JavaScript line biako mpo. Eyi yɛ Bootstrap API a edi kan na ɛsɛ sɛ ɛyɛ nea edi kan a wususuw ho bere a wode plugin redi dwuma no.
Ɛno akyi no, wɔ tebea horow bi mu no, ebia ɛbɛyɛ papa sɛ wudum saa dwumadi yi. Enti, yɛsan nso ma tumi a yɛde besiw data attribute API no ano denam nsɛm a esisi nyinaa a wobeyi afi krataa no so a wɔde din ahyɛ mu no so data-api
. Eyi te sɛ eyi:
Sɛnea ɛbɛyɛ a, sɛ wopɛ sɛ wode w’ani si plugin pɔtee bi so a, fa plugin no din ka ho kɛkɛ sɛ dinbea ka data-api dinbea no ho te sɛ eyi:
Mfa data su ahorow a efi plugins pii mu nni dwuma wɔ element koro no ara so. Sɛ nhwɛso no, bɔtn ntumi nnya adwinnade ho nsɛm na ɛsakra modal. Sɛ wopɛ sɛ woyɛ eyi a, fa ade a wɔde kyekyere nneɛma ho di dwuma.
Yɛsan nso gye di sɛ ɛsɛ sɛ wutumi de Bootstrap plugins nyinaa di dwuma denam JavaScript API no so ara kwa. Ɔmanfoɔ API nyinaa yɛ akwan baako, a wɔde nkɔnsɔnkɔnsɔn gu so, na ɛsan de nneɛma a wɔaboaboa ano a wɔayɛ ho adwuma no ba.
Ɛsɛ sɛ akwan nyinaa gye optional options ade, ahama a ɛde n’ani si ɔkwan pɔtee bi so, anaasɛ biribiara (a ɛhyɛ plugin ase a ɛwɔ default suban):
Plugin biara nso da ne raw constructor adi wɔ Constructor
agyapade bi so: $.fn.popover.Constructor
. Sɛ wopɛ sɛ wonya plugin nhwɛso pɔtee bi a, gye no tẽẽ fi element bi mu: $('[rel="popover"]').data('popover')
.
Wubetumi asesa nhyehyɛe a wɔahyɛ da ayɛ ama plugin bi denam plugin no Constructor.DEFAULTS
ade a wobɛsesa no so:
Ɛtɔ da bi a ɛho hia sɛ wode Bootstrap plugins di dwuma ne UI frameworks afoforo. Wɔ saa tebea horow yi mu no, edin-ahunmu nhyiam betumi aba bere ne bere mu. Sɛ eyi ba a, wubetumi afrɛ .noConflict
plugin a wopɛ sɛ wosan de bo no ba no.
Bootstrap ma amanneɛbɔ nsɛm a esisi ma plugins dodow no ara nneyɛe soronko. Mpɛn pii no, eyinom ba wɔ asɛmfua a enni awiei ne adeyɛ a atwam mu - baabi a wɔde asɛmfua a enni awiei (ex. show
) no kanyan wɔ adeyɛ bi mfiase, na ne adeyɛ asɛm bi a atwam (ex. shown
) no fi ase bere a adeyɛ bi awie no.
Ɛde besi 3.0.0 no, Bootstrap nsɛm a esisi nyinaa wɔ din ntam.
Nsɛm a esisi a enni awiei nyinaa ma wotumi preventDefault
yɛ adwuma. Eyi ma wotumi gyina adeyɛ bi a wɔyɛ no ano ansa na afi ase.
Wobetumi afa VERSION
plugin no constructor no agyapade so akɔ Bootstrap jQuery plugins no mu biara nkyerɛase no so. Sɛ nhwɛso no, wɔ adwinnade ho nkyerɛkyerɛmu plugin no ho no:
Bootstrap no plugins no nkɔ akyi titiriw gracefully bere a JavaScript ayɛ adwuma no. Sɛ wodwene dwumadiefoɔ suahunu ho wɔ saa asɛm yi mu a, fa <noscript>
kyerɛkyerɛ tebea no mu (ne sɛdeɛ wobɛsan ama JavaScript ayɛ adwuma) ama wo dwumadiefoɔ, ne/anaasɛ fa w’ankasa wo custom fallbacks ka ho.
Bootstrap ntumi mmoa JavaScript nhomakorabea ahorow a ɛto so abiɛsa te sɛ Prototype anaa jQuery UI wɔ aban kwan so. Ɛmfa ho .noConflict
ne nsɛm a esisi a wɔde din ahyɛ mu no, ebia ɔhaw ahorow a ɛfa nhyiam ho wɔ hɔ a ɛsɛ sɛ w’ankasa wusiesie.
Sɛ wopɛ nsakrae nsunsuanso a ɛnyɛ den a, fa ka ho transition.js
pɛnkoro ka JS fael afoforo no ho. Sɛ wode compiled (anaasɛ minified) no redi dwuma a bootstrap.js
, ɛho nhia sɛ wode eyi bɛka ho—ɛwɔ hɔ dedaw.
Transition.js yɛ ɔboafoɔ titire ma nsɛm a transitionEnd
ɛsisi ne CSS nsakraeɛ emulator nso. Plugin afoforo no de di dwuma de hwɛ CSS nsakrae mmoa na ɛkyere nsakrae a ɛsensɛn hɔ.
Wobetumi asiw nsakrae ahorow ano wɔ wiase nyinaa denam JavaScript afã a edidi so yi so, a ɛsɛ sɛ ɛba bere a transition.js
(anaasɛ bootstrap.js
anaa bootstrap.min.js
, sɛnea ɛte biara) ahyɛ mu akyi:
Modals no yɛ streamlined, nanso ɛyɛ mmerɛw, nkɔmmɔbɔ nsɛm a ɛkyerɛ a ɛwɔ dwumadie a ɛsua koraa a wɔhwehwɛ ne smart defaults.
Hwɛ hu sɛ woremmue modal bi bere a foforo da so ara da so ara da adi no. Sɛ wobɛkyerɛ modal bɛboro biako wɔ bere koro mu a, ɛhwehwɛ sɛ wode custom code.
Bere nyinaa bɔ mmɔden sɛ wode modal bi HTML koodu bɛto soro-gyinabea wɔ wo krataa no mu na woakwati nneɛma afoforo a ɛbɛka modal no hwɛbea ne/anaasɛ ne dwumadi.
Kɔkɔbɔ ahorow bi wɔ hɔ a ɛfa modals a wɔde bedi dwuma wɔ mobile mfiri ahorow so ho. Hwɛ yɛn browser support docs no ma nsɛm no mu nsɛm.
Esiane sɛnea HTML5 kyerɛkyerɛ ne nkyerɛase mu nti, autofocus
HTML su no nni nkɛntɛnso biara wɔ Bootstrap modals mu. Sɛ wopɛ sɛ wunya nkɛntɛnso koro no ara a, fa JavaScript bi a wɔahyɛ da ayɛ di dwuma:
Modal a wɔakyerɛ ase a ɛwɔ atiri, nipadua, ne nneyɛe ahorow a wɔahyehyɛ wɔ ase hɔ.
Toggle a modal via JavaScript denam button a ɛwɔ ase ha no a wobɛma so. Ɛbɛtwetwe akɔ fam na ɛbɛyera afi kratafa no atifi.
Hwɛ hu sɛ wode role="dialog"
ne aria-labelledby="..."
, bɛka modal asɛmti no ho, akɔ .modal
, ne role="document"
ankasa .modal-dialog
so.
Bio nso, wobɛtumi de wo modal dialog no ho nkyerɛkyerɛmu ama aria-describedby
wɔ on .modal
.
YouTube video ahorow a wode bɛhyɛ modals mu no hwehwɛ JavaScript foforo a enni Bootstrap mu na ama woagyae playback no ankasa ne nea ɛkeka ho. Hwɛ Stack Overflow post a ɛboa yi ma nsɛm pii.
Modals wɔ akɛseɛ mmienu a wobɛpaw, a ɛwɔ hɔ denam modifier classes a wɔde bɛto a .modal-dialog
.
Sɛ wopɛ modals a ɛda adi kɛkɛ sen sɛ ɛbɛyera akɔ mu ahwɛ a, yi .fade
adesua no fi wo modal markup no mu.
Sɛ wopɛ sɛ wunya Bootstrap grid nhyehyɛe no mu mfaso wɔ modal bi mu a, nest .row
s kɛkɛ wɔ mu .modal-body
na afei fa grid nhyehyɛe no adesua ahorow a ɛyɛ daa no di dwuma.
Wowɔ button ahorow bi a ne nyinaa kanyan modal koro no ara, a emu nsɛm yɛ soronko kakra kɛkɛ? Fa event.relatedTarget
ne HTML data-*
su ahorow (ebia ɛnam jQuery so ) di dwuma de sesa modal no mu nsɛm a egyina bɔtn a wɔakliki so. Hwɛ Modal Events docs no ma nsɛm a ɛfa relatedTarget
, .
Modal plugin no dannan wo nsɛm a ahintaw no bere a wɔhwehwɛ no, ɛnam data su anaa JavaScript so. Ɛsan nso de ka .modal-open
to <body>
override default scrolling behavior no ho na ɛma a .modal-backdrop
to ma click area ma dismissing shown modals bere a clicking outside the modal.
Fa modal bi yɛ adwuma a wonkyerɛw JavaScript. Fa data-toggle="modal"
si controller element bi so, te sɛ button, ne a data-target="#foo"
anaasɛ href="#foo"
sɛ wode besi modal pɔtee bi so sɛ wobɛdannan.
Frɛ modal a ɛwɔ id myModal
a ɛwɔ JavaScript line biako:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-backdrop=""
.
Din | korɔ | mfiaseɛ | nkyerɛmu |
---|---|---|---|
akyi mfonini | boolean anaasɛ ahama no'static' |
nokorɛ | Nea ɛka ho ne modal-backdrop element bi. Sɛnea ɛbɛyɛ a, kyerɛ static ma akyigyina a ɛnto modal no mu wɔ klik so. |
keyboard so nsɛm | boolean a ɛwɔ hɔ | nokorɛ | Ɛto modal no mu bere a wɔabɔ escape key no |
da no adi | boolean a ɛwɔ hɔ | nokorɛ | Kyerɛ modal no bere a wɔahyɛ ase no. |
akurase tuu | kwan | ɛnyɛ ampa | Saa nhyehyɛe yi yɛ nea wɔagyae fi v3.3.0 na wɔayi afi hɔ wɔ v4 mu. Yɛhyɛ nyansa mmom sɛ fa client-side templating anaa data binding framework di dwuma, anaasɛ frɛ jQuery.load w’ankasa. Sɛ wɔde URL a ɛwɔ akyirikyiri ma a, wɔde nsɛm no bɛhyɛ mu pɛnkoro denam jQuery |
.modal(options)
Ɛma wo nsɛm no yɛ adwuma sɛ modal. Gye akwan a wubetumi apaw bi tom object
.
.modal('toggle')
Nsaano toggles a modal. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔakyerɛ modal no ankasa anaa wɔde asie (kyerɛ sɛ ansa na shown.bs.modal
anaa hidden.bs.modal
adeyɛ no aba).
.modal('show')
Nsaano bue modal bi. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔada modal no adi ankasa (kyerɛ sɛ ansa na shown.bs.modal
asɛm no asi).
.modal('hide')
Nsaano de sie modal bi. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔde modal no asie ankasa (kyerɛ sɛ ansa na hidden.bs.modal
asɛm no asi).
.modal('handleUpdate')
Ɔsan siesie modal no gyinabea de ko tia scrollbar bi sɛ ebia ɛsɛ sɛ biako pue a, a ɛbɛma modal no ahuruw akɔ benkum so.
Ɛho hia bere a modal no sorokɔ sesa bere a wɔabue no nkutoo.
Bootstrap no modal adesuakuw no da nsɛm kakraa bi a esisii adi ma hooking kɔ modal dwumadi mu.
Wɔtow modal nsɛm a esisi nyinaa wɔ modal no ankasa so (kyerɛ sɛ wɔ <div class="modal">
).
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.modal | Saa adeyɛ yi tow ntɛm ara bere a show wɔfrɛ instance kwan no. Sɛ kliki na ɛde ba a, element a wɔakliki no wɔ hɔ sɛ relatedTarget adeyɛ no agyapade. |
wɔakyerɛ.bs.modal | Wɔtow saa adeyɛ yi bere a wɔayɛ modal no ahu nea ɔde di dwuma no (bɛtwɛn ma CSS nsakrae ahorow no awie). Sɛ kliki na ɛde ba a, element a wɔakliki no wɔ hɔ sɛ relatedTarget adeyɛ no agyapade. |
hide.bs.modal no ho nsɛm | Wɔtow saa adeyɛ yi ntɛm ara bere a hide wɔafrɛ instance kwan no. |
ahintaw.bs.modal | Wɔtow saa adeyɛ yi bere a wɔawie modal no a wɔde asie ama ɔdefo no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
a wɔde ahyɛ mu.bs.modal | Wɔtow saa adeyɛ yi bere a modal no de nsɛm a ɛwɔ mu no ahyɛ mu denam remote option no so. |
Fa dropdown menus ka ɛkame ayɛ sɛ biribiara ho denam saa plugin a ɛnyɛ den yi so, a navbar, tabs, ne pills ka ho.
Ɛnam data attributes anaa JavaScript so no, dropdown plugin no dannan nneɛma a ahintaw (dropdown menus) denam .open
adesuakuw no a ɛsakra wɔ ɔwofo list ade no so.
Wɔ mobile mfiri ahorow so no, sɛ wubue dropdown bi a, ɛde a .dropdown-backdrop
sɛ tap beae a wobɛto dropdown menu ahorow mu bere a worebɔ wɔ menu no akyi no ka ho, a ɛyɛ ahwehwɛde a ɛbɛma woanya iOS mmoa a ɛfata. Wei kyerɛ sɛ sɛ wodan fi dropdown menu a wɔabue mu kɔ dropdown menu foforo so a, ɛhwehwɛ sɛ wobɔ mobile so bio.
Hyɛ no nsow: Wɔde data-toggle="dropdown"
wɔn ho to attribute no so de to dropdown menus mu wɔ application level bi so, enti ɛyɛ adwene pa sɛ wode bedi dwuma bere nyinaa.
Fa ka data-toggle="dropdown"
link anaa button bi ho na dannan dropdown bi.
Sɛ wopɛ sɛ wode link buttons di dwuma a, fa data-target
attribute no di dwuma sen sɛ wode href="#"
.
Frɛ nsɛm a ɛwɔ ase hɔ no denam JavaScript so:
data-toggle="dropdown"
wɔda so ara hwehwɛƐmfa ho sɛ ebia wobɛfrɛ wo dropdown no denam JavaScript so anaasɛ wode data-api no bedi dwuma mmom no, data-toggle="dropdown"
ɛhwehwɛ sɛ ɛwɔ hɔ bere nyinaa wɔ dropdown no trigger element no so.
Ɛnyɛ ebiara
$().dropdown('toggle')
Toggles dropdown menu a ɛwɔ navbar anaa tabbed navigation a wɔde ama no mu.
Wɔde dropdown nsɛm a esisi nyinaa tow wɔ .dropdown-menu
's parent element no so.
Nsɛm a esisi a ɛba fam nyinaa wɔ relatedTarget
agyapade bi, a ne bo yɛ toggling anchor element.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.a ɛwɔ ase hɔ | Saa adeyɛ yi tow ntɛm ara bere a wɔfrɛ show instance kwan no. |
wɔakyerɛ.bs.dropdown | Wɔtow saa adeyɛ yi bere a wɔayɛ dropdown no ahu nea ɔde di dwuma no (bɛtwɛn ma CSS nsakrae ahorow, awie). |
hide.bs.a ɛwɔ ase hɔ | Wɔtow saa adeyɛ yi ntɛm ara bere a wɔafrɛ hide instance kwan no. |
ahintaw.bs.a ɛwɔ ase hɔ | Wɔtow saa adeyɛ yi bere a wɔawie dropdown no a wɔde asie ama ɔdefo no (bɛtwɛn ma CSS nsakrae ahorow, awie). |
ScrollSpy plugin no yɛ ma nav botae ahorow a egyina scroll gyinabea so no yɛ foforo ankasa. Twe beae a ɛwɔ navbar no ase no na hwɛ adesuakuw a ɛreyɛ adwuma no nsakrae. Wɔbɛtwe adwene asi nneɛma a ɛwɔ dropdown sub no so nso.
Ad leggings keytar, brunch id adwini apontow dolor adwumayɛfo. Pitchfork yr enim lo-fi ansa na wɔretɔn qui. Tumblr afuw-kɔ-pon sakre hokwan ahorow biara. Anim keffiyeh carles a ɔyɛ ɔkwasea. Velit seitan mcsweeney mfonini dan 3 ɔkraman ɔsram irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui ebia wontee wɔn ho asɛm et cardigan ahotoso sikakorabea culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred aseresɛm biodiesel keffiyeh nsaanodwumayɛfo ullamco consequat.
Veniam marfa abɔgyesɛ skateboard, adipisicing fugiat velit pitchfork abɔgyesɛ. Freegan abɔgyesɛ aliqua cupidat mcsweeney no vero. Cupidatat anan loko nisi, ea helvetica nulla carles. Tattooed cosby sweater aduan lɔre, mcsweeney no quis a ɛnyɛ freegan vinyl. Lo-fi wes anderson +1 a wɔde hyɛ ntade mu. Carles non aesthetic apɔw-mu-teɛteɛ quis gentrify. Brooklyn adipisicing nsaanodwuma beer abadiakyiri keytar deserunt.
Occaecat commodo a wɔde yɛ aduan a ɛyɛ dɛ. Fap nsaanodwuma beer deserunt skateboard ea. Lomo sakre hokwan adipisicing banh mi, velit ea sunt next level locavore biako-mfiase kɔfe wɔ magna veniam. Nkwa a ɛkorɔn id vinyl, echo park consequat quis aliquip banh mi pitchfork. Vero VHS est a wɔde yɛ aduan. Consectetur nisi DIY minim ɔbɔfo bag. Cred ex wɔ, delectus consectetur fanny pack iphone a ɛbɛkɔ so atra hɔ daa.
In incididunt echo park, officia deserunt mcsweeney's proident master cleanse thundercats sapiente veniam. Excepteur VHS elit, proident shoreditch +1 biodiesel laborum craft beer. Single-origin coffee wayfarers irure four loko, cupidatat terry richardson master cleanse. Assumenda you probably haven't heard of them art party fanny pack, tattooed nulla cardigan tempor ad. Proident wolf nesciunt sartorial keffiyeh eu banh mi sustainable. Elit wolf voluptate, lo-fi ea portland before they sold out four loko. Locavore enim nostrud mlkshk brooklyn nesciunt.
Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.
Keytar twee blog, culpa ɔbɔfo bag marfa nea ɛte biara delectus aduan lɔre. Sapiente synth id a ɛkyerɛ sɛ obi yɛ ade. Locavore sed helvetica cliche irony, aprannaa a ebia wontee wɔn ho asɛm consequat hoodie gluten-free lo-fi fap aliquip. Labore elit placeat ansa na wɔretɔn awie, terry richardson proident brunch nesciunt quis cosby sweater pariatur keffiyeh ut helvetica adwumfo. Cardigan nsaanodwuma beer seitan a wɔasiesie velit. VHS chambray adwuma no yɛ bere tiaa mu veniam. Anim mollit minim commodo ullamco aprannaa a ɛrebɔ.
Ɛsɛ sɛ Navbar link ahorow no nya id botae ahorow a wobetumi asiesie. Sɛ nhwɛso no, <a href="#home">home</a>
ɛsɛ sɛ a ne biribi a ɛwɔ DOM no mu te sɛ <div id="home"></div>
.
:visible
wɔn ani agu nneɛma a ɛnyɛ botae soWɔbɛbu ani agu target elements a ɛnsɛ :visible
sɛ jQuery kyerɛ no so na wɔrensi wɔn nav nneɛma a ɛne no hyia no so dua da.
Ɛmfa ho ɔkwan a wɔfa so de di dwuma no, scrollspy hwehwɛ sɛ wode di dwuma position: relative;
wɔ element a woreyɛ akwansra so no so. Mpɛn pii no eyi ne <body>
. Sɛ woreyɛ scrollspying wɔ elements a ɛnyɛ <body>
, hwɛ hu sɛ wowɔ height
set na wode adi overflow-y: scroll;
dwuma.
Sɛnea ɛbɛyɛ a ɛbɛyɛ mmerɛw sɛ wode scrollspy suban bɛka wo topbar navigation ho no, fa ka data-spy="scroll"
element a wopɛ sɛ wohwɛ so no ho (mpɛn pii no eyi bɛyɛ <body>
). Afei fa data-target
attribute no ka ho ne ID anaa class a ɛwɔ ɔwofo element a ɛwɔ Bootstrap .nav
component biara mu.
Sɛ wode position: relative;
wo CSS no ka ho wie a, frɛ scrollspy no fa JavaScript so:
.scrollspy('refresh')
Sɛ wode scrollspy di dwuma de ka nneɛma a wode bɛka ho anaa woayi afi DOM no mu ho a, ɛho behia sɛ wofrɛ refresh kwan no te sɛ saa:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-offset=""
.
Din | korɔ | mfiaseɛ | nkyerɛmu |
---|---|---|---|
offset a wɔde hyɛ mu | nɔma | 10. 10 | Pixels to offset fi soro bere a worebu gyinabea a scroll no. |
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
yɛ adwuma.bs.scrollspy | Saa adeyɛ yi tow bere biara a ade foforo bi bɛyɛ adwuma denam nhoma mmobɔwee no so. |
Fa tab dwumadie a ɛyɛ ntɛm a ɛyɛ nnam ka ho ma nsakraeɛ fa panes a ɛwɔ mpɔtam hɔ nsɛm mu, mpo denam dropdown menus so. Nested tabs no ntumi mmoa.
Raw denim ebia wontee wɔn ho asɛm jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth owura ahotew. Mustache cliche bere tiaa mu, williamsburg carles vegan helvetica. Reprehenderit namkumfoɔ retro keffiyeh daeɛ kyerefoɔ synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Ɔde ne nsa kyerɛɛ ne so, na ɔde ne nsa kyerɛɛ ne so bio. Aliquip placeat salvia a ɔyɛ ɔbarima a ɔpɛ sɛ ɔyɛ biribi. Seitan aliquip quis cardigan american ntade, namtɔnfo voluptate nisi qui.
Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson 8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson biodiesel. Art party scenester stumptown, tumblr butcher vero sint qui sapiente accusamus tattooed echo park.
Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney's organic lomo retro fanny pack lo-fi farm-to-table readymade. Messenger bag gentrify pitchfork tattooed craft beer, iphone skateboard locavore carles etsy salvia banksy hoodie helvetica. DIY synth PBR banksy irony. Leggings gentrify squid 8-bit cred pitchfork. Williamsburg banh mi whatever gluten-free, carles pitchfork biodiesel fixie etsy retro mlkshk vice blog. Scenester cred you probably haven't heard of them, vinyl craft beer blog stumptown. Pitchfork sustainable tofu synth chambray yr.
Trust fund seitan letterpress, keytar raw denim keffiyeh etsy art party before they sold out master cleanse gluten-free squid scenester freegan cosby sweater. Fanny pack portland seitan DIY, art party locavore wolf cliche high life echo park Austin. Cred vinyl keffiyeh DIY salvia PBR, banh mi before they sold out farm-to-table VHS viral locavore cosby sweater. Lomo wolf viral, mustache readymade thundercats keffiyeh craft beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park vegan.
Saa plugin yi trɛw tabbed navigation component no mu de tabbable mmeae ka ho.
Ma tabable tabs no nyɛ adwuma denam JavaScript so (ɛsɛ sɛ wode tab biara yɛ adwuma mmiako mmiako):
Wubetumi ayɛ tab ahorow ankorankoro adwuma wɔ akwan horow pii so:
Wubetumi ama tab anaa pill navigation ayɛ adwuma a worenkyerɛw JavaScript biara denam element bi a wobɛkyerɛ ara kwa data-toggle="tab"
anaasɛ wobɛka so. data-toggle="pill"
Sɛ wode nav
ne nav-tabs
adesua ahorow no ka tab ul
no ho a ɛbɛma wode Bootstrap tab no ayɛ adwuma , bere a wode nav
ne nav-pills
adesua ahorow no aka ho no de pill styling no bedi dwuma .
Sɛ wopɛ sɛ tab ahorow no bɛyera a, fa ka .fade
emu biara ho .tab-pane
. Ɛsɛ sɛ tab pane a edi kan no nso .in
ma nsɛm a edi kan no da adi.
$().tab
Ɛma tab element ne nsɛm a ɛwɔ mu no yɛ adwuma. Ɛsɛ sɛ tab nya a data-target
anaasɛ href
targeting a container node wɔ DOM no mu. Wɔ atifi hɔ nhwɛso ahorow no mu no, tab ahorow no ne <a>
s a ɛwɔ data-toggle="tab"
su ahorow no.
.tab('show')
Paw tab a wɔde ama no na ɛkyerɛ emu nsɛm a ɛbata ho. Tab foforo biara a na wɔadi kan apaw no bɛyɛ nea wɔanpaw na emu nsɛm a ɛbata ho no sie. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔakyerɛ tab pane no ankasa (kyerɛ sɛ ansa na shown.bs.tab
asɛm no asi).
Sɛ worekyerɛ tab foforo a, nsɛm a esisi no bɛtow nnidiso nnidiso a edidi so yi:
hide.bs.tab
(wɔ tab a ɛreyɛ adwuma mprempren no so)show.bs.tab
(wɔ tab a wɔrebɛkyerɛ no so)hidden.bs.tab
(wɔ active tab a atwam no so no, nea ɛwɔ hide.bs.tab
adeyɛ no ho no ara)shown.bs.tab
(wɔ tab a wɔakyerɛ seesei ara a ɛyɛ adwuma foforo no so no, nea ɛwɔ show.bs.tab
adeyɛ no ho no ara)Sɛ na tab biara nni hɔ a ɛyɛ adwuma dedaw a, ɛnde wɔrentow hide.bs.tab
ne hidden.bs.tab
nsɛm a esisi no.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.tab no | Saa adeyɛ yi tow wɔ tab show so, nanso ansa na wɔakyerɛ tab foforo no. Fa event.target ne di dwuma event.relatedTarget fa w’ani si active tab ne active tab a atwam no so (sɛ ɛwɔ hɔ a) sɛnea ɛte biara. |
wɔakyerɛ.bs.tab | Saa adeyɛ yi tow wɔ tab show so bere a wɔakyerɛ tab bi akyi. Fa event.target ne di dwuma event.relatedTarget fa w’ani si active tab ne active tab a atwam no so (sɛ ɛwɔ hɔ a) sɛnea ɛte biara. |
hide.bs.tab no ho nsɛm | Saa adeyɛ yi tow bere a ɛsɛ sɛ wɔkyerɛ tab foforo (na ɛnam saa kwan yi so no ɛsɛ sɛ wɔde tab a ɛyɛ adwuma a atwam no sie). Fa event.target ne di dwuma event.relatedTarget fa w’ani si tab a ɛreyɛ adwuma mprempren ne tab foforo a ɛrenkyɛ na ɛreyɛ adwuma no so, sɛnea ɛte biara. |
ahintaw.bs.tab no | Saa adeyɛ yi tow bere a wɔakyerɛ tab foforo akyi (na ɛnam saa kwan yi so no wɔde tab a ɛyɛ adwuma a atwam no asie). Fa event.target ne di dwuma event.relatedTarget fa w’ani si tab a ɛreyɛ adwuma a atwam no ne tab a ɛreyɛ adwuma foforo no so, sɛnea ɛte biara. |
Wɔde jQuery.tipsy plugin a eye kyɛn so a Jason Frame kyerɛwee no na ɛkanyan no; Nnwinnade ho nsɛm yɛ nkyerɛase a wɔayɛ no foforo, a ɛnyɛ mfonini so, ɛde CSS3 di dwuma ma animations, ne data-attributes ma local title storage.
Nnwinnade ho nsɛm a ɛwɔ asɛmti a ne tenten yɛ zero no nkyerɛ da.
Fa wo nsa hyɛ link ahorow a ɛwɔ ase ha no so na wubehu nnwinnade ho nyansahyɛ ahorow:
Tight pants next level keffiyeh ebia wontee wɔn ho asɛm. Mfonini dan abɔgyesɛ raw denim letterpress vegan ɔbɔfo bag stumptown. Farm-to-table seitan, mcsweeney fixie sustainable quinoa 8-bit american ntade wɔ terry richardson vinyl chambray. Abɔgyesɛ stumptown, cardigans banh mi lomo aprannaa. Tofu biodiesel williamsburg marfa, anan loko mcsweeney no tew vegan chambray ho. A really ironic artisan whatever keytar , scenester afuw-kɔ-pon banksy Austin twitter di freegan cred raw denim biako-mfiase kɔfe viral.
Nneɛma anan wɔ hɔ a wubetumi apaw: atifi, nifa, ase, ne benkum a wɔahyehyɛ no pɛpɛɛpɛ.
Esiane adwumayɛ nti, Tooltip ne Popover data-apis no yɛ opt-in, a ɛkyerɛ sɛ ɛsɛ sɛ w’ankasa wohyɛ ase .
Ɔkwan baako a wobɛfa so ahyɛ adwinnadeɛ a ɛwɔ kratafa bi so nyinaa ase ne sɛ wobɛpaw wɔn denam wɔn data-toggle
su so:
Adwinnade ho nkyerɛkyerɛmu plugin no yɛ nsɛm ne agyiraehyɛde wɔ ahwehwɛde so, na default so de adwinnade ho nsɛm si wɔn trigger element no akyi.
Fa JavaScript so na ɛkanyan adwinnade no:
Agyiraehyɛde a wɔhwehwɛ ma adwinnade ho nkyerɛkyerɛmu no yɛ data
su bi nkutoo na title
wɔ HTML element no so no wopɛ sɛ wunya adwinnade ho nsɛm. Nnwinnade bi agyiraehyɛde a wɔayɛ no yɛ mmerɛw mmom, ɛwom sɛ ɛhwehwɛ gyinabea (default no, wɔde ahyɛ mu top
denam plugin no so).
Ɛtɔ da bi a wopɛ sɛ wode adwinnade bi ka hyperlink a ɛkyekyere nkyerɛwde pii ho. Adwinnade tip plugin no suban a wɔahyɛ da ayɛ ne sɛ ɛbɛma no mfinimfini akɔ soro na akɔ soro. Fa ka white-space: nowrap;
wo ankora ahorow ho na woakwati eyi.
Sɛ wode adwinnade ho akwankyerɛ redi dwuma wɔ nneɛma a ɛwɔ a .btn-group
anaa an .input-group
mu, anaasɛ nneɛma a ɛfa pon ho ( <td>
, <th>
, <tr>
, <thead>
, <tbody>
, <tfoot>
) so a, ɛsɛ sɛ wokyerɛ ɔkwan a wobɛfa so container: 'body'
(wɔakyerɛw wɔ ase hɔ) na woakwati nsunsuanso bɔne a wompɛ (te sɛ element no a ɛretrɛw ne/ anaasɛ ɛyera ne ntwea a ɛyɛ kurukuruwa no bere a wɔabɔ adwinnade no ano no).
Wɔ wɔn a wɔde keyboard di dwuma, ne titiriw no, wɔn a wɔde mfiridwuma a ɛboa di dwuma no, ɛsɛ sɛ wode adwinnade ho nsɛm ka nneɛma a ɛtwe adwene si keyboard so te sɛ links, form controls, anaa element biara a wɔpɛ a ɛwɔ tabindex="0"
su bi nkutoo ho.
Sɛ wode adwinnade a wɔde bɛka a disabled
anaa .disabled
element ho a, fa element no hyɛ a mu <div>
na fa adwinnade no di dwuma wɔ ɛno so <div>
mmom.
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-animation=""
.
Din | Korɔ | Mfiaseɛ | Nkyerɛmu |
---|---|---|---|
animation a wɔde yɛ nneɛma | boolean a ɛwɔ hɔ | nokorɛ | Fa CSS fade nsakrae bi di dwuma wɔ adwinnade no ho |
ade a wɔde gu mu | ahama | ɛnyɛ ampa | ɛnyɛ ampa | Fa adwinnade no ho nkyerɛkyerɛmu no ka element pɔtee bi ho. Nhwɛso: |
ka akyi | nɔma | adeɛ | 0 na ɛwɔ hɔ | Delay kyerɛ na wɔde sie tooltip (ms) - no mfa manual trigger type ho Sɛ wɔde nɔma bi ma a, wɔde delay di dwuma wɔ hide/show abien no nyinaa mu Adeɛ nhyehyɛɛ ne: |
html na ɛwɔ hɔ | boolean a ɛwɔ hɔ | ɛnyɛ ampa | Fa HTML hyɛ adwinnade no mu. Sɛ ɛyɛ atoro a, wɔde jQuery text kwan no bedi dwuma de ahyɛ nsɛm a ɛwɔ DOM no mu. Fa text di dwuma sɛ XSS ntua ho asɛm haw wo a. |
a wɔde bɛto hɔ | ahama | dwumadie | 'soro' | Sɛnea wɔde adwinnade no gyina hɔ - soro | ase hɔ | benkum so | nifa so | auto. Sɛ wɔde dwumadie bi di dwuma de kyerɛ beaeɛ a wɔde bɛto a, wɔfrɛ no a adwinnadeɛ tip DOM node yɛ ne asɛm a ɛdi kan na triggering element DOM node yɛ nea ɛtɔ so mmienu. Wɔde |
nea ɔpaw ade | ahoma | ɛnyɛ ampa | Sɛ wɔde selector bi ma a, wɔde tooltip nneɛma bɛhyɛ botae ahorow a wɔakyerɛ no nsa. Wɔ nneyɛe mu no, wɔde eyi di dwuma de ma HTML nsɛm a ɛyɛ nnam no tumi nya nnwinnade ho nkyerɛkyerɛmu. Hwɛ eyi ne nhwɛso a ɛma nsɛm pii . |
nsusuwso | ahoma | '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>' |
Base HTML a wode bedi dwuma bere a woreyɛ adwinnade no ho nsɛm. Wɔde adwinnade no
Ɛsɛ sɛ wrapper element a ɛwɔ akyi paa no nya |
atiti asɛm | ahama | dwumadie | '' . | Default title value sɛ Sɛ wɔde dwumadie bi ma a, wɔbɛfrɛ no a ne |
nkanyan | ahoma | 'hover focus'. | Sɛnea wɔde adwinnade tip no hyɛ ase - klik | hover | adwene a wɔde si biribi so | akwankyerɛ. Wubetumi atwam wɔ nneɛma pii a ɛkanyan adwene mu; fa ahunmu tetew wɔn mu. manual wontumi mfa nkata ade foforo biara a ɛkanyan no ho. |
hwɛbea a wɔde hwɛ nneɛma | ahama | ade | dwumadie | { selector: 'nipadua', padding: 0 } . | Ɛma adwinnade no nsɛm no sie wɔ saa element yi hye mu. Nhwɛso: Sɛ wɔde dwumadie bi ma a, wɔfrɛ no a triggering element DOM node yɛ ne argument baako pɛ. Wɔde |
Wobetumi akyerɛ akwan foforo a wɔbɛfa so akyerɛ ankorankoro nnwinnade ho akwankyerɛ denam data su ahorow a wɔde bedi dwuma so, sɛnea wɔakyerɛkyerɛ mu wɔ atifi hɔ no.
$().tooltip(options)
Fa adwinnade a wɔde di dwuma no bata element ahorow a wɔaboaboa ano ho.
.tooltip('show')
Ɛda element bi adwinnade ho nsɛm adi. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔada adwinnade no adi ankasa (kyerɛ sɛ ansa na shown.bs.tooltip
asɛm no asi). Wobu eyi sɛ "nsaano" a ɛkanyan adwinnade no. Nnwinnade ho nsɛm a ɛwɔ asɛmti a ne tenten yɛ zero no nkyerɛ da.
.tooltip('hide')
Fa element bi adwinnade ho nsɛm sie. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔde adwinnade no asie ankasa (kyerɛ sɛ ansa na hidden.bs.tooltip
asɛm no asi). Wobu eyi sɛ "nsaano" a ɛkanyan adwinnade no.
.tooltip('toggle')
Toggles element bi adwinnade ho nsɛm. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔada adwinnade no adi ankasa anaa wɔde asie (kyerɛ sɛ ansa na shown.bs.tooltip
anaa hidden.bs.tooltip
adeyɛ no aba). Wobu eyi sɛ "nsaano" a ɛkanyan adwinnade no.
.tooltip('destroy')
Hide na ɛsɛe element bi adwinnade tip. Nnwinnade a wɔde delegation di dwuma (a wɔde option ) na ɛyɛe noselector
ntumi nsɛe no ankorankoro wɔ descendant trigger elements so.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.adwinnade ho nsɛm | Saa adeyɛ yi tow ntɛm ara bere a show wɔfrɛ instance kwan no. |
wɔakyerɛ.bs.adwinnade ho nsɛm | Wɔtow saa adeyɛ yi bere a wɔayɛ adwinnade no nkyerɛkyerɛmu no ahu nea ɔde di dwuma no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
hide.bs.adwinnade ho nsɛm | Wɔtow saa adeyɛ yi ntɛm ara bere a hide wɔafrɛ instance kwan no. |
hidden.bs.adwinnade ho nsɛm | Wɔtow saa adeyɛ yi bere a wɔawie adwinnade no nsɛm a wɔde asie ama ɔdefo no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
wɔde ahyɛ mu.bs.adwinnade ho nsɛm | Wɔtow saa adeyɛ yi wɔ adeyɛ no akyi show.bs.tooltip bere a wɔde adwinnade nkyerɛkyerɛmu nsusuwso no aka DOM no ho. |
Fa nsɛm nketenkete a wɔde akata so, te sɛ nea ɛwɔ iPad no so, ka element biara a wode bɛfa nsɛm a ɛto so abien no ho.
Popovers a wɔn asɛmti ne emu nsɛm nyinaa yɛ zero-length no, wɔmfa nkyerɛ da.
Popovers hwehwɛ sɛ wɔde tooltip plugin no bɛka wo Bootstrap version no ho.
Esiane adwumayɛ nti, Tooltip ne Popover data-apis no yɛ opt-in, a ɛkyerɛ sɛ ɛsɛ sɛ w’ankasa wohyɛ ase .
Ɔkwan baako a wobɛfa so ahyɛ popovers nyinaa ase wɔ krataafa bi so ne sɛ wobɛpaw wɔn denam wɔn data-toggle
su so:
Sɛ wode popovers redi dwuma wɔ elements a ɛwɔ a .btn-group
anaa an .input-group
mu, anaasɛ wɔ table-related elements ( <td>
, <th>
, <tr>
, <thead>
, <tbody>
, <tfoot>
) so a, ɛsɛ sɛ wokyerɛ ɔkwan a wobɛfa so container: 'body'
(wɔakyerɛw ho asɛm wɔ ase hɔ) na woakwati nsunsuanso bɔne a wɔmpɛ (te sɛ element no a ɛrenyin kɛse ne/ anaasɛ ɛhwere ne ntwea a ɛyɛ kurukuruwa bere a popover no kanyan no).
Sɛ wode popover bɛka a disabled
anaa .disabled
element ho a, fa element no hyɛ a mu <div>
na fa popover no gu saa no so <div>
mmom.
Ɛtɔ da bi a wopɛ sɛ wode popover ka hyperlink a ɛkyekyere nkyerɛwde pii ho. Popover plugin no suban a wɔahyɛ da ayɛ ne sɛ ɛbɛma no mfinimfini akɔ soro na akɔ soro. Fa ka white-space: nowrap;
wo ankora ahorow ho na woakwati eyi.
Nneɛma anan wɔ hɔ a wubetumi apaw: atifi, nifa, ase, ne benkum a wɔahyehyɛ no pɛpɛɛpɛ.
Sed posuere consectetur a ɛyɛ fɛ wɔ lobortis ho. Aenean eu leo quam. Pellentesque ornare sem lacinia a ɛwɔ akyi no.
Sed posuere consectetur a ɛyɛ fɛ wɔ lobortis ho. Aenean eu leo quam. Pellentesque ornare sem lacinia a ɛwɔ akyi no.
Sed posuere consectetur a ɛyɛ fɛ wɔ lobortis ho. Aenean eu leo quam. Pellentesque ornare sem lacinia a ɛwɔ akyi no.
Sed posuere consectetur a ɛyɛ fɛ wɔ lobortis ho. Aenean eu leo quam. Pellentesque ornare sem lacinia a ɛwɔ akyi no.
Fa focus
trigger no di dwuma fa yi popovers no wɔ klik a edi hɔ a nea ɔde di dwuma no yɛ no so.
Sɛ wopɛ sɛ wobɔ cross-browser ne cross-platform suban yiye a, ɛsɛ sɛ wode <a>
tag no di dwuma, ɛnyɛ tag no <button>
, na ɛsɛ sɛ wode role="button"
ne tabindex
su ahorow no nso ka ho.
Ma popovers nyɛ adwuma denam JavaScript so:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-animation=""
.
Din | Korɔ | Mfiaseɛ | Nkyerɛmu |
---|---|---|---|
animation a wɔde yɛ nneɛma | boolean a ɛwɔ hɔ | nokorɛ | Fa CSS fade nsakrae bi di dwuma wɔ popover no so |
ade a wɔde gu mu | ahama | ɛnyɛ ampa | ɛnyɛ ampa | Ɛde popover no ka element pɔtee bi ho. Nhwɛso: |
emu nsɛm | ahama | dwumadie | '' . | Default content value sɛ Sɛ wɔde dwumadie bi ma a, wɔbɛfrɛ no a ne |
ka akyi | nɔma | adeɛ | 0 na ɛwɔ hɔ | Delay kyerɛ na wɔde sie popover (ms) - no mfa manual trigger type ho Sɛ wɔde nɔma bi ma a, wɔde delay di dwuma wɔ hide/show abien no nyinaa mu Adeɛ nhyehyɛɛ ne: |
html na ɛwɔ hɔ | boolean a ɛwɔ hɔ | ɛnyɛ ampa | Fa HTML hyɛ popover no mu. Sɛ ɛyɛ atoro a, wɔde jQuery text kwan no bedi dwuma de ahyɛ nsɛm a ɛwɔ DOM no mu. Fa text di dwuma sɛ XSS ntua ho asɛm haw wo a. |
a wɔde bɛto hɔ | ahama | dwumadie | 'nifa' | Sɛnea wɔde popover no si hɔ - soro | ase hɔ | benkum so | nifa so | auto. Sɛ wɔde dwumadie bi di dwuma de kyerɛ beaeɛ a wɔde bɛto a, wɔfrɛ no a popover DOM node no yɛ ne akasakasa a ɛdi kan na triggering element DOM node yɛ ne deɛ ɛtɔ so mmienu. Wɔde |
nea ɔpaw ade | ahoma | ɛnyɛ ampa | Sɛ wɔde selector bi ma a, wɔde popover nneɛma bɛhyɛ botae ahorow a wɔakyerɛ no nsa. Wɔ nneyɛe mu no, wɔde eyi di dwuma de ma HTML nsɛm a ɛyɛ nnam no tumi nya popovers a wɔde aka ho. Hwɛ eyi ne nhwɛso a ɛma nsɛm pii . |
nsusuwso | ahoma | '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>' |
Base HTML a wode bedi dwuma bere a woreyɛ popover no. Wɔde popover no Wɔde popover no
Ɛsɛ sɛ wrapper element a ɛwɔ akyi paa no nya |
atiti asɛm | ahama | dwumadie | '' . | Default title value sɛ Sɛ wɔde dwumadie bi ma a, wɔbɛfrɛ no a ne |
nkanyan | ahoma | 'kliki'. | Sɛnea popover no fi ase - klik | hover | adwene a wɔde si biribi so | akwankyerɛ. Wubetumi atwam wɔ nneɛma pii a ɛkanyan adwene mu; fa ahunmu tetew wɔn mu. manual wontumi mfa nkata ade foforo biara a ɛkanyan no ho. |
hwɛbea a wɔde hwɛ nneɛma | ahama | ade | dwumadie | { selector: 'nipadua', padding: 0 } . | Ɛma popover no kɔ so tra saa element yi hye mu. Nhwɛso: Sɛ wɔde dwumadie bi ma a, wɔfrɛ no a triggering element DOM node yɛ ne argument baako pɛ. Wɔde |
Wobetumi akyerɛ akwan foforo a wɔbɛfa so akyerɛ ankorankoro popovers denam data su ahorow a wɔde bedi dwuma so, sɛnea wɔakyerɛkyerɛ mu wɔ atifi hɔ no.
$().popover(options)
Fi ase popovers ma element ahorow a wɔaboaboa ano.
.popover('show')
Ɛda element bi popover adi. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔada popover no adi ankasa (kyerɛ sɛ ansa na shown.bs.popover
asɛm no asi). Wobu eyi sɛ "nsaano" a ɛkanyan popover no. Popovers a wɔn asɛmti ne emu nsɛm nyinaa yɛ zero-length no, wɔmfa nkyerɛ da.
.popover('hide')
Fa element bi popover no sie. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔde popover no asie ankasa (kyerɛ sɛ ansa na hidden.bs.popover
asɛm no asi). Wobu eyi sɛ "nsaano" a ɛkanyan popover no.
.popover('toggle')
Toggles element bi popover. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔakyerɛ popover no ankasa anaa wɔde asie (kyerɛ sɛ ansa na shown.bs.popover
anaa hidden.bs.popover
adeyɛ no aba). Wobu eyi sɛ "nsaano" a ɛkanyan popover no.
.popover('destroy')
Hide na ɛsɛe element bi popover. Popovers a ɛde delegation di dwuma (a wɔbɔ denam option noselector
so ) no ntumi nsɛe no ankorankoro wɔ descendant trigger elements so.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.popover | Saa adeyɛ yi tow ntɛm ara bere a show wɔfrɛ instance kwan no. |
wɔakyerɛ.bs.popover | Wɔtow saa adeyɛ yi bere a wɔayɛ popover no ahu nea ɔde di dwuma no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
hide.bs.popover a ɛwɔ hɔ no | Wɔtow saa adeyɛ yi ntɛm ara bere a hide wɔafrɛ instance kwan no. |
ahintaw.bs.ohia | Wɔtow saa adeyɛ yi bere a popover no awie a wɔde asie ama ɔdefo no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
wɔde ahyɛ mu.bs.popover | Wɔtow saa adeyɛ yi wɔ adeyɛ no akyi show.bs.popover bere a wɔde popover template no aka DOM no ho. |
Fa dismiss dwumadie ka kɔkɔbɔ nkra nyinaa ho denam saa plugin yi so.
Sɛ wode .close
bɔtn redi dwuma a, ɛsɛ sɛ ɛyɛ no ba a odi kan .alert-dismissible
na nsɛm biara a ɛwɔ mu no ntumi mma n’anim wɔ agyiraehyɛde no mu.
Sesa eyi ne eyi na san bɔ mmɔden bio. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus no tena ase sɛ ɛyɛ aduru a wɔde yɛ aduan.
Fa ka data-dismiss="alert"
wo close button no ho kɛkɛ na ama woanya alert close functionality no ara. Sɛ woto kɔkɔbɔ bi mu a, eyi fi DOM no mu.
Sɛ wopɛ sɛ wo kɔkɔbɔ ahorow no de animation bedi dwuma bere a woretoto mu a, hwɛ hu sɛ wɔwɔ .fade
ne .in
adesua ahorow a wɔde adi dwuma dedaw wɔ wɔn ho.
$().alert()
Ɛma kɔkɔbɔ tie click nsɛm a esisi wɔ aseni elements a ɛwɔ data-dismiss="alert"
attribute no so. (Ɛho nhia bere a wode data-api no auto-initialization redi dwuma no.)
$().alert('close')
Ɛto kɔkɔbɔ bi mu denam yi a wubeyi afi DOM no mu no so. Sɛ .fade
ne .in
adesua ahorow no wɔ element no so a, kɔkɔbɔ no bɛyera ansa na wɔayi afi hɔ.
Bootstrap no kɔkɔbɔ plugin no da nsɛm kakraa bi a esisi ma hooking kɔ kɔkɔbɔ dwumadi mu adi.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
close.bs.asɛm no ho kɔkɔbɔ | Saa adeyɛ yi tow ntɛm ara bere a close wɔfrɛ instance kwan no. |
a wɔato mu.bs.alert | Wɔtow saa adeyɛ yi bere a wɔato kɔkɔbɔ no mu (bɛtwɛn ma CSS nsakrae ahorow no awie). |
Fa buttons yɛ pii. Control button states anaa yɛ buttons akuo ma components pii te sɛ toolbars.
Firefox kɔ so yɛ form control states (disabledness ne checkedness) wɔ krataafa a wɔde ahyɛ mu nyinaa mu . Ade a wobetumi asiesie eyi ne sɛ wode autocomplete="off"
. Hwɛ Mozilla bɔne #654072 .
Fa ka data-loading-text="Loading..."
ho na wode loading tebea adi dwuma wɔ button bi so.
Saa ade yi yɛ nea wɔagyae fi v3.3.5 na wɔayi afi hɔ wɔ v4 mu.
Saa ɔyɛkyerɛ yi nti, yɛde ne redi dwuma data-loading-text
, $().button('loading')
nanso ɛnyɛ ɛno nko ara ne tebea a wubetumi de adi dwuma. Hwɛ eyi ho nsɛm pii wɔ ase hɔ wɔ $().button(string)
nkrataa no mu .
Fa ka data-toggle="button"
ho na ama toggling a ɛwɔ button biako so no ayɛ adwuma.
.active
naaria-pressed="true"
Sɛ wopɛ sɛ wodi kan toggled buttons a, ɛsɛ sɛ wode .active
class no ne aria-pressed="true"
attribute no ka button
wo ho no ho.
Fa ka data-toggle="buttons"
checkbox .btn-group
anaa radio inputs a ɛwɔ mu no ho na ama woatumi ayɛ toggling wɔ wɔn styles mu.
.active
Sɛ wopɛ sɛ wopaw nneɛma a woadi kan apaw a, ɛsɛ sɛ wode .active
adesuakuw no ka input no label
ho w’ankasa.
Sɛ wɔayɛ checkbox button bi tebea a wɔahyɛ no foforo a wɔrentow click
adeyɛ bi wɔ button no so (sɛ nhwɛso no, via <input type="reset">
anaasɛ via setting the checked
property of the input), ɛho behia sɛ wo toggle .active
class no wɔ input no so label
w’ankasa.
$().button('toggle')
Toggles push tebea no. Ɛma button no te sɛ nea wɔayɛ no adwuma.
$().button('reset')
Sesa button tebea - sesa nsɛm kɔ mfitiase nkyerɛwee so. Saa kwan yi yɛ asynchronous na ɛsan ba ansa na resetting no awie ankasa.
$().button(string)
Sesa nsɛm kɔ data biara a wɔakyerɛkyerɛ nkyerɛwee tebea mu.
Flexible plugin a ɛde nsa kakraa bi adesua ahorow di dwuma ma toggle suban a ɛyɛ mmerɛw.
Collapse hwehwɛ sɛ wode transitions plugin no bɛka wo Bootstrap no ho.
Klik buttons a ɛwɔ aseɛ ha no so na kyerɛ na fa element foforɔ bi sie denam class nsakraeɛ so:
.collapse
de nsɛm a ɛwɔ mu no sie.collapsing
wɔde di dwuma wɔ nsakrae ahorow mu.collapse.in
kyerɛ emu nsɛmWubetumi de link a ɛwɔ href
attribute no adi dwuma, anaasɛ button a ɛwɔ data-target
attribute no. Wɔ nsɛm abien no nyinaa mu no, data-toggle="collapse"
wɔhwehwɛ sɛ wɔyɛ saa.
Trɛw default collapse suban no mu na yɛ accordion ne panel component no.
Ɛsan nso yɛ yie sɛ wobɛsesa .panel-body
s ne .list-group
s.
Hwɛ hu sɛ wode bi bɛka aria-expanded
control element no ho. Saa su yi kyerɛkyerɛ mprempren tebea a ɛwɔ element a ɛtumi hwe ase no mu pefee to screen akenkanfoɔ ne mfiridwuma a ɛboa a ɛte saa ara mu. Sɛ wɔato element a wotumi bubu mu no mu default so a, ɛsɛ sɛ ɛwɔ bo a ɛyɛ aria-expanded="false"
. Sɛ woahyɛ collapsible element no sɛ ɛbɛbue default denam in
class no so a, fa aria-expanded="true"
si control no so mmom. Plugin no bɛdannan saa su yi ankasa a egyina sɛ ebia wɔabue anaa wɔato mu anaasɛ wɔanto mu anaasɛ wɔanto mu.
Bio nso, sɛ wo control element no de n’ani asi element biako a wotumi bubu mu so – kyerɛ sɛ, data-target
su no rekyerɛ id
selector bi a – wubetumi de su foforo aria-controls
aka control element no ho, a id
of the of the collapsible element no wom. Nnɛyi screen akenkanfo ne mfiridwuma a ɛte saa a ɛboa no de saa su yi di dwuma de ma wɔn a wɔde di dwuma no nya akwan tiawa foforo a wɔbɛfa so akɔ element a wotumi bubu no ankasa so tẽẽ.
Collapse plugin no de adesua kakraa bi di dwuma de di nneɛma a emu yɛ duru a wɔma so no ho dwuma:
.collapse
de emu nsɛm no sie.collapse.in
kyerɛ emu nsɛm no.collapsing
wɔde ka ho bere a nsakrae no afi ase, na woyi fi hɔ bere a awie noWobetumi ahu saa adesua ahorow yi wɔ component-animations.less
.
Kɛkɛ fa data-toggle="collapse"
ne a data-target
ka element no ho ma automatically assign control of a collapsible element. Attribute no data-target
gye CSS selector bi a wɔde collapse no bedi dwuma wɔ so. Hwɛ hu sɛ wode adesuakuw no bɛka collapse
element a wotumi bu no ho. Sɛ wopɛ sɛ ɛbue default a, fa adesua foforo no ka ho in
.
Sɛ wode kuw nhyehyɛe a ɛte sɛ accordion bɛka control a wotumi bubu mu ho a, fa data su no ka ho data-parent="#selector"
. Hwɛ demo no na woahu eyi wɔ adeyɛ mu.
Fa nsa yɛ adwuma denam:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-parent=""
.
Din | korɔ | mfiaseɛ | nkyerɛmu |
---|---|---|---|
ɔwofo | nea ɔpaw ade | ɛnyɛ ampa | Sɛ wɔde selector bi ma a, ɛnde wɔbɛto nneɛma a wobetumi abubu mu nyinaa wɔ ɔwofo a wɔakyerɛ no ase bere a wɔakyerɛ saa ade a wotumi bu mu yi. (te sɛ atetesɛm accordion suban - eyi gyina panel adesuakuw no so) . |
toggle no | boolean a ɛwɔ hɔ | nokorɛ | Toggles element a ɛyɛ collapsible wɔ invocation so |
.collapse(options)
Ɛma wo nsɛm no yɛ adwuma sɛ ade a wotumi bu mu. Gye akwan a wubetumi apaw bi tom object
.
.collapse('toggle')
Toggles a collapsible element ma wɔakyerɛ anaa wɔde asie. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔakyerɛ element a wotumi bubu no ankasa anaa wɔde asie (kyerɛ sɛ ansa na shown.bs.collapse
anaa hidden.bs.collapse
adeyɛ no aba).
.collapse('show')
Kyerɛ element bi a ɛtumi hwe ase. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔakyerɛ element a wotumi bubu mu no ankasa (kyerɛ sɛ ansa na shown.bs.collapse
asɛm no asi).
.collapse('hide')
Ɛde element bi a wotumi bubu mu sie. San kɔ nea ɔfrɛ no no nkyɛn ansa na wɔde element a wotumi bubu mu no asie ankasa (kyerɛ sɛ ansa na hidden.bs.collapse
asɛm no asi).
Bootstrap no collapse adesua no da nsɛm kakraa bi a esisi ma hooking kɔ collapse dwumadi mu adi.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
kyerɛ.bs.collapse | Saa adeyɛ yi tow ntɛm ara bere a show wɔfrɛ instance kwan no. |
wɔakyerɛ.bs.collapse | Wɔtow saa adeyɛ yi bere a wɔayɛ collapse element bi a ɔde di dwuma no ahu (bɛtwɛn ma CSS nsakrae ahorow no awie). |
hide.bs.asɛm a wɔde sie | Wɔtow saa adeyɛ yi ntɛm ara bere a hide wɔafrɛ ɔkwan no awie no. |
ahintaw.bs.abɔ | Wɔtow saa adeyɛ yi bere a wɔde collapse element bi asie nea ɔde di dwuma no (bɛtwɛn ma CSS nsakrae ahorow no awie). |
Slideshow afã bi a wɔde sakre fa element ahorow mu, te sɛ carousel. Wɔntumi mmoa carousels a wɔde ahyɛ mu no.
Mpɛn pii no, carousel fã no ne gyinapɛn ahorow a ɛfa akwan a wɔfa so nya nneɛma ho no nhyia. Sɛ ɛho hia sɛ wudi mmara so a, yɛsrɛ wo susuw akwan foforo a wobɛfa so de wo nsɛm no akyerɛ no ho.
Bootstrap de CSS3 nkutoo na ɛyɛ ne animations, nanso Internet Explorer 8 & 9 ntumi mmoa CSS agyapade a ɛho hia no. Enti, slide transition animations biara nni hɔ bere a wode saa browser ahorow yi redi dwuma no. Yɛahyɛ da asi gyinae sɛ yɛremfa jQuery-gyina fallbacks nka ho mma nsakrae ahorow no.
Ɛsɛ .active
sɛ wɔde adesuakuw no ka slide ahorow no biako ho. Sɛ ɛnte saa a, wɔrenhu carousel no.
Na .glyphicon .glyphicon-chevron-left
ne .glyphicon .glyphicon-chevron-right
adesua ahorow no nhia ankasa ma controls no. Bootstrap ma .icon-prev
na .icon-next
sɛ plain unicode alternatives.
Fa nsɛm a wɔakyerɛw no ka wo slide ahorow no ho mmerɛw denam .carousel-caption
element a ɛwɔ biara mu .item
no so . Fa HTML biara a wopɛ no to mu wɔ hɔ na ɛbɛyɛ nea ɛne ne ho hyia na wɔayɛ no sɛnea ɛte no ara.
Carousel ahorow hwehwɛ sɛ wɔde biribi di dwuma wɔ ade id
a ɛwɔ akyi pɛɛ no so (the .carousel
) na ama carousel controls ahorow no atumi ayɛ adwuma yiye. Sɛ wode carousel pii ka ho, anaasɛ woresakra carousel’s id
, hwɛ hu sɛ wobɛma controls a ɛfa ho no ayɛ foforo.
Fa data attributes di dwuma na ama ɛnyɛ den sɛ wobɛhwɛ carousel no gyinabea so. data-slide
gye nsɛmfua titiriw prev
anaa next
, a ɛsakra slide gyinabea no toto ne gyinabea a ɛwɔ hɔ mprempren no ho. Sɛnea ɛbɛyɛ a, fa di dwuma data-slide-to
de fa raw slide index kɔ carousel data-slide-to="2"
, a ɛsakra slide no gyinabea kɔ index pɔtee bi a efi ase0
.
Wɔde data-ride="carousel"
su no di dwuma de hyɛ carousel agyirae sɛ ɛyɛ animating a efi ase wɔ kratafa a wɔde hyɛ mu. Wontumi mfa nni dwuma nka (redundant ne nea ɛho nhia) pefee JavaScript mfiase a ɛwɔ carousel koro no ara ho.
Frɛ carousel denam nsa so de:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-interval=""
.
Din | korɔ | mfiaseɛ | nkyerɛmu |
---|---|---|---|
ntamgyinafo | nɔma | 5000 na ɛwɔ hɔ | Bere dodow a ɛsɛ sɛ wɔtwentwɛn so wɔ ade bi a wɔde sakre tu kwan ankasa ntam. Sɛ ɛyɛ atoro a, carousel renkyinkyin ne ho. |
home so | ahama | ohunu | "hover" no. | Sɛ wode si "hover" , a, egyina carousel no sakre a ɛretu no so mouseenter na ɛsan fi ase de sakre a ɛretu wɔ carousel no so no mouseleave . Sɛ wode si null , a, sɛ wode wo ho to carousel no so a, ɛrennyae. |
kyekyere ho | boolean a ɛwɔ hɔ | nokorɛ | Sɛ́ ebia ɛsɛ sɛ carousel no di sakre bere nyinaa anaasɛ ɛwɔ gyinabea a ɛyɛ den. |
keyboard so nsɛm | boolean a ɛwɔ hɔ | nokorɛ | Sɛ ebia ɛsɛ sɛ carousel no yɛ n’ade wɔ nsɛm a esisi wɔ keyboard so no ho anaa. |
.carousel(options)
Initializes carousel ne optional options object
na ofi ase sakre fa nneɛma mu.
.carousel('cycle')
Kyinkyin fa carousel nneɛma no mu fi benkum kɔ nifa.
.carousel('pause')
Siw carousel no kwan sɛ ɛnsɛ sɛ ɔde sakre fa nneɛma mu.
.carousel(number)
Cycles carousel no kɔ frame pɔtee bi so (0 a egyina so, a ɛte sɛ array).
.carousel('prev')
Kyinkyin kɔ ade a atwam no so.
.carousel('next')
Kyinkyin kɔ ade a edi hɔ no so.
Bootstrap carousel adesuakuw no da nsɛm abien a esisi ma hooking kɔ carousel dwumadi mu adi.
Nsɛm abien no nyinaa wɔ nneɛma foforo a edidi so yi:
direction
: Ɔkwan a carousel no retwe ( "left"
anaasɛ "right"
).relatedTarget
: DOM element a wɔretwetwe akɔ ne gyinabea sɛ ade a ɛyɛ adwuma.Wɔtow carousel nsɛm a esisi nyinaa tow gu carousel no ankasa so (kyerɛ sɛ, wɔ <div class="carousel">
).
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
slide.bs.carousel a wɔde hyɛ mu | Saa adeyɛ yi tow ntɛm ara bere a slide wɔfrɛ instance kwan no. |
slid.bs.afiri a wɔde hyɛ kar mu | Wɔtow saa adeyɛ yi bere a carousel no awie ne slide nsakrae no. |
Affix plugin no dannan position: fixed;
ne ho na ɛdum, na ɛsuasua nkɛntɛnso a wohu wɔ position: sticky;
. Subnavigation a ɛwɔ nifa so no yɛ live demo a ɛkyerɛ affix plugin no.
Fa affix plugin no di dwuma denam data attributes so anaasɛ fa nsa di dwuma denam w’ankasa JavaScript so. Wɔ tebea abien no nyinaa mu no, ɛsɛ sɛ wode CSS ma wo nsɛm a wode ahyɛ mu no gyinabea ne ne tɛtrɛtɛ.
Hyɛ no nsow: Mfa affix plugin no nni dwuma wɔ element bi a ɛwɔ element a ɛwɔ gyinabea kakra mu, te sɛ kɔla a wɔatwe anaa wɔapia, esiane Safari nkyerɛase bɔne nti .
Affix plugin no dannan adesua ahorow abiɛsa ntam, a emu biara gyina hɔ ma tebea pɔtee bi: .affix
, .affix-top
, ne .affix-bottom
. Ɛsɛ sɛ wode styles no ma, gye position: fixed;
on .affix
, ma saa adesua ahorow yi w’ankasa (a ɛde ne ho fi saa plugin yi ho) di gyinabea ahorow ankasa no ho dwuma.
Sɛnea affix plugin no yɛ adwuma ni:
.affix-top
de kyerɛ sɛ element no wɔ ne gyinabea a ɛwɔ soro paa. Saa bere yi de CSS gyinabea biara ho nhia..affix
si ananmu .affix-top
na wɔde si hɔ position: fixed;
(a Bootstrap CSS de ama)..affix
de .affix-bottom
. Esiane sɛ offsets yɛ nea wopɛ nti, sɛ wode biako si hɔ a, ɛhwehwɛ sɛ wode CSS a ɛfata si hɔ. Sɛ ɛba saa a, fa ka ho position: absolute;
bere a ɛho hia no. Plugin no de data attribute anaa JavaScript option no di dwuma de kyerɛ baabi a wode element no besi afi hɔ.Di atifi hɔ anammɔn no akyi na fa wo CSS no si hɔ ma dwumadie akwan a ɛwɔ aseɛ ha no mu biara.
Sɛnea ɛbɛyɛ a ɛbɛyɛ mmerɛw sɛ wode affix suban bɛka element biara ho no, fa ka data-spy="affix"
element a wopɛ sɛ wohwɛ so no ho kɛkɛ. Fa offsets di dwuma de kyerɛ bere a ɛsɛ sɛ wodannan element bi pinning.
Frɛ affix plugin no fa JavaScript so:
Wobetumi afa data attributes anaa JavaScript so de nneɛma a wobɛpaw no akɔ. Sɛ wopɛ data su ahorow a, fa option din no ka ho data-
, sɛnea ɛwɔ data-offset-top="200"
.
Din | korɔ | mfiaseɛ | nkyerɛmu |
---|---|---|---|
offset a wɔde hyɛ mu | nɔma | dwumadie | adeɛ | 10. 10 | Pixels to offset fi screen bere a worebu gyinabea a scroll no. Sɛ wɔde nɔma biako ma a, wɔde offset no bedi dwuma wɔ soro ne ase nyinaa. Sɛ wode offset soronko bɛma a, ase ne soro offset kɛkɛ ma ade offset: { top: 10 } anaa offset: { top: 10, bottom: 5 } . Fa dwumadie bi di dwuma berɛ a ɛhia sɛ wode dynamically bu offset bi ho akontaa. |
deɛ ani si so | nea ɔpaw | node no | jAsɛmmisa element | ade window no |
Kyerɛ ade a wɔde asi wɔn ani so wɔ affix no mu. |
.affix(options)
Ɛma wo nsɛm no yɛ adwuma sɛ nsɛm a wɔde ahyɛ mu. Gye akwan a wubetumi apaw bi tom object
.
.affix('checkPosition')
Ɔsan bu affix no tebea ho akontaa gyina nneɛma a ɛfa ho no nsusuwii, gyinabea, ne nhoma mmobɔwee gyinabea so. Wɔde .affix
, .affix-top
, ne .affix-bottom
adesua ahorow no ka nsɛm a wɔde ahyɛ mu no ho anaasɛ woyi fi mu sɛnea tebea foforo no te. Ɛsɛ sɛ wɔfrɛ saa kwan yi bere biara a wɔbɛsesa nsɛm a wɔde ahyɛ mu no nsusuwii anaa ade a wɔde asi wɔn ani so no, na ama wɔahwɛ ahu sɛ wɔde nsɛm a wɔde ahyɛ mu no besi hɔ yiye.
Bootstrap no affix plugin no da nsɛm kakraa bi a esisi ma hooking kɔ affix dwumadi mu adi.
Nsɛm a Ɛsisii no Su | Nkyerɛmu |
---|---|
affix.bs.asɛm a wɔde hyɛ mu | Saa adeyɛ yi tow ntɛm ara ansa na wɔde element no abata ho. |
a wɔde ahyɛ mu.bs.affix | Wɔtow saa adeyɛ yi bere a wɔde element no abata ho akyi. |
affix-top.bs.afiri a wɔde hyɛ mu | Saa adeyɛ yi tow ntɛm ara ansa na wɔde element no abata-top. |
affixed-top.bs.a wɔde ahyɛ mu | Wɔtow saa adeyɛ yi bere a wɔde element no ahyɛ-top no akyi. |
affix-ase.bs.ahyɛaseɛ | Saa adeyɛ yi tow ntɛm ara ansa na wɔde element no abata-ase. |
affixed-ase.bs.a wɔde ahyɛ ase | Wɔtow saa adeyɛ yi bere a wɔde element no ahyɛ-ase no akyi. |