Javascript bakeng sa Bootstrap

Tliša dikarolo tša Bootstrap bophelong-bjale ka di-plugin tše 12 tša jQuery tša tlwaelo.

Di-modal

A streamlined, empa tenyetsehang, nka ka setso javascript modal plugin le feela bonyane hlokahalang tshebetso le bohlale defaults.

Di-dropdown tša go theoga

Oketša dimenu tša go theoga go mo e nyakilego go ba selo le ge e le sefe ka go Bootstrap ka plugin ye e bonolo. Bootstrap litšobotsi feletseng dropdown menu ya tšehetso ka ka navbar, dithepo, le lipilisi.

Scrollspy ya go phuthwa

Šomiša scrollspy go mpshafatša ka go iketla dikgokagano ka go navbar ya gago go bontšha kgokagano ya bjale ye e šomago go ya ka maemo a go sepelasepela.

Dithepo tšeo di ka fetošwago

Šomiša plugin ye go dira gore dithepo le dipilisi di be le mohola kudu ka go di dumelela go fetola ka diphanephe tša dithepo tša diteng tša selegae.

Dikeletšo tša didirišwa

A e ncha nka ka jQuery Tipsy plugin, Tooltips ha ba itšetlehile ka litšoantšo-ba sebelisa CSS3 bakeng sa ditshwantsho tse ditshwantsho le ya data-dika bakeng sa polokelo ya thaetlele ya sebakeng seo.

Dipopovers * .

Oketša dikhupetšo tše nnyane tša dikagare, go swana le tšeo di lego go iPad, go elemente efe goba efe ya go apa tshedimošo ya bobedi.

* E nyaka gore Tooltips e akaretšwe

Melaetša ya temošo

Plugin ya temošo ke sehlopha se senyenyane sa go oketša mošomo wa kgauswi go ditemošo.

Dikonope

Dira mo gontši ka dikonope. Taolo konope e bolela goba hlama dihlopha tša dikonope bakeng sa dikarolo tše dingwe go swana le dibara tša didirišwa.

Phuhlama

Hwetša mekgwa ya motheo le thekgo ye e fetofetogago ya dikarolo tše di phuhlamago go swana le di-accordion le go sepelasepela.

Carousel ya go swara

Hlama merry-go-round ya diteng dife goba dife tšeo o nyakago go fa pontšho ya diselaete ya tirišano ya diteng.

Thaepa pele

Plugin ya motheo, yeo e katološitšwego gabonolo bakeng sa go hlama ka pela di-typeahead tša maemo ka tsenyo efe goba efe ya sengwalwa sa foromo.

Diphetogo * .

Bakeng sa diphetho tše bonolo tša phetogo, akaretša bootstrap-transition.js gatee go thelela ka gare ga modals goba go fifala ditemošo.

* E hlokeha bakeng sa animatsioon ka plugins

Dihlogo godimo! Di-plugin ka moka tša javascript di nyaka phetolelo ya moragorago ya jQuery.

Mabapi le di-modal

A streamlined, empa tenyetsehang, nka ka setso javascript modal plugin le feela bonyane hlokahalang tshebetso le bohlale defaults.

Download faele ya

Mohlala wa static

Ka tlase ke statically e filwe modal.

Demo e phelang

Toggle a modal ka javascript ka ho tobetsa konopo e ka tlase. E tla thelela fase gomme ya fifala ka gare go tšwa godimo ga letlakala.

Thakgola mokgwa wa demo

Go diriša bootstrap-modal

Bitsa modal ka javascript:

  1. $ ( '#Modal ya ka' ). modal ( dikgetho ) .

Dikgetho

Leina mohuta hlokomologa tlhalošo
lemorago la ka morago boolean ya go swana nnete E akaretša elemente ya modal-backdrop. Ka go fapana le moo, laetša staticbakeng sa backdrop yeo e sa tswalelego modal ka go klika.
khiiboto ya boolean ya go swana nnete E tswalela modal ge senotlelo sa go tšhaba se tobetšwe
bontšha boolean ya go swana nnete E bontšha modal ge e thongwa.

Go swaya

O ka tsenya tirišong di-modal letlakaleng la gago gabonolo ntle le go ngwala mola o tee wa javascript. E no beakanya data-toggle="modal"godimo ga elemente ya molaodi ka data-target="#foo"goba href="#foo"yeo e sepelelanago le id ya elemente ya modal, gomme ge e kgotla, e tla thoma modal ya gago.

Gape, go oketša dikgetho go mohlala wa gago wa modal, di akaretša fela bjalo ka dika tša tlaleletšo tša datha go e ka ba elemente ya taolo goba go swaya modal ka boyona.

  1. <a sehlopha = "btn" data-toggle = "modal" href = "#myModal" > Thoma Modal </a>
  1. <div sehlopha = "modal pata" id = "myModal" >
  2. <div sehlopha = "modal-hlooho" >
  3. < mohuta wa konope = "konope" sehlopha = "tswalela" data-dismiss = "modal" > × </konopo>
  4. <h3> Hlogo ya modale </h3>
  5. </div> e
  6. <div sehlopha = "modal-mmele" >
  7. <p> Mmele o tee o mobotse... </p>
  8. </div> e
  9. <div sehlopha = "modal-footer" >
  10. <a href = "#" sehlopha = "btn" data-dismiss = "modal" > Tswala </a>
  11. <a href = "#" class = "btn btn-primary" > Boloka diphetogo </a>
  12. </div> e
  13. </div> e
Dihlogo godimo! Ge e ba o nyaka gore modal ya gago e phele ka gare le ka ntle, e no oketša .fadesehlopha go .modalelemente (lebelela demo go bona se ka tiro) gomme o akaretše bootstrap-transition.js.

Mekgwa ya go šoma

.modal(dikgetho) .

E dira gore diteng tša gago di šome bjalo ka modal. E amogela dikgetho tša boikhethelo object.

  1. $ ( '#Modal ya ka' ). modal ({ ) .
  2. khiiboto : maaka
  3. }) .

.modal (' go fetola') .

Ka seatla e fetola modal.

  1. $ ( '#Modal ya ka' ). modal ( 'go fetola' ) .

.modal ('bontša') .

Ka letsoho bula e modal.

  1. $ ( '#Modal ya ka' ). modal ( 'bontša' ) .

.modal('pata') .

Ka letsoho pata e modal.

  1. $ ( '#Modal ya ka' ). modal ( 'pata' ) .

Ditiragalo

Bootstrap o modal sehlopha pepesa liketsahalo tse seng kae bakeng sa hooking ka modal tshebetso.

Tiragalo Tlhalošo
bontšha Tiragalo ye e thunya ka pela ge showmokgwa wa mohlala o bitšwa.
e bontšhitšwe Tiragalo ye e thuntšhwa ge modal e dirilwe gore e bonagale go mosediriši (e tla emela gore diphetogo tša css di phethe).
fihla Tiragalo ye e thuntšhwa ka pela ge hidemokgwa wa mohlala o biditšwe.
fihlilwe Tiragalo ye e thuntšhwa ge modal e feditše go utollwa go tšwa go mosediriši (e tla emela gore diphetogo tša css di phethe).
  1. $ ( '#Modal ya ka' ). ka ( 'e patiloeng' , mosebetsi () {
  2. // dira se sengwe...
  3. }) .

The ScrollSpy plugin ke bakeng sa ka tsela e iketsang ntjhafatsa nav diphetho thehiloeng scroll boemo.

Download faele ya

Mohlala navbar le scrollspy

Scroll lefelo le le lego ka mo tlase gomme o lebelele mpshafatšo ya go sepelasepela. Diaetheme tša ka fasana tša go theoga di tla hlaolwa gape. E leke!

@lekhura

Ad leggings keytar, brunch id bonono mokga dolor labore. Pitchfork yr enim lo-fi pele ba rekisa qui. Tumblr polasa-ho-tafoleng baesekele ditokelo eng kapa eng. Anim keffiyeh carles cardigan ya go swana le yona. Velit seitan mcsweeney o photo photo photo lephephe 3 phiri ngwedi irure. Cosby jesi lomo jean shorts, williamsburg hoodie minim qui mohlomong ha ua utloa ka bona et cardigan letlole la tšepo culpa biodiesel wes anderson botsebi. Nihil tattooed accusamus, cred kgegeo biodiesel keffiyeh mosebetsi oa matsoho ullamco consequat.

@mdo

Veniam marfa ditedu skateboard, adipisicing fugiat velit ditedu tša foroko ya pitchfork. Freegan ditedu aliqua cupidatat vero ya mcsweeney. Cupidatat ba bane loko nisi, ea helvetica nulla carles. Tattooed cosby jesi lijo teraka, mcsweeney o quis bao e seng freegan vinyl. Lo-fi wes anderson +1 seaparo sa go robala. Carles bao e seng botsebi boitšhidullo quis gentrify. Brooklyn adipisicing mesebetsi ea matsoho biri motlatsi keytar deserunt.

tee

Occaecat commodo ya go swana le ya go swana le ya delectus. Fap mesebetsi ea matsoho biri deserunt skateboard ea. Lomo baesekele ditokelo adipisicing banh mi, velit ea sunt boemo bo latelang locavore e le 'ngoe-tšimoloho kofi ka magna veniam. Bophelo bo phahameng id vinyl, echo phakeng consequat quis aliquip banh mi foroko ea pitchfork. Vero VHS est go godiša. Consectetur nisi DIY bonyane mokotla wa moromiwa. Cred ex ka, tšoarellang delectus consectetur fanny pakete iphone.

pedi

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.

three

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 mokotla wa moromiwa marfa eng kapa eng delectus lijo teraka. Sapiente synth id assumenda. Locavore sed helvetica cliche kgegeo, thundercats mohlomong ha ua utloa ka bona consequat hoodie gluten-free lo-fi fap aliquip. Labore elit placeat pele ba rekisa, terry richardson proident brunch nesciunt quis cosby jesi pariatur keffiyeh ut helvetica mosebetsi oa matsoho. Cardigan mesebetsi ea matsoho biri seitan readymade velit. VHS chambray laboris veniam ya nakwana. Anim mollit minima commodo ullamco dikatse tsa diaduma.


Go diriša bootstrap-scrollspy.js

Bitsa scrollspy ka javascript:

  1. $ ( '# navbar' ). scrollspy () .

Go swaya

Go oketša gabonolo boitshwaro bja scrollspy go go sepelasepela ga gago ga topbar, oketša feela data-spy="scroll"go elemente yeo o nyakago go e hlola (ka tlwaelo kudu se e be e tla ba mmele).

  1. <mmele ya data-spy = "moqolo" > ... </mmele>
Dihlogo godimo! Dikgokagano tša Navbar di swanetše go ba le diphetho tša id tšeo di ka rarollwago. Ka mohlala, a e <a href="#home">home</a>swanetše go sepelelana le selo se sengwe ka dom go swana le <div id="home"></div>.

Mekgwa ya go šoma

.scrollspy (' hlabolla') .

Ge o diriša scrollspy ka kopanelo le go tlaleletša goba go tloša dielemente go tšwa go DOM, o tla swanelwa ke go bitša mokgwa wa go hlabolla go swana le bjalo:

  1. $ ( '[data-spy = "phetola"]' ). e mong le e ( mosebetsi () { .
  2. var $ sehloela = $ ( ena ). scrollspy ( 'tlhabolla' ) .
  3. });

Dikgetho

Leina mohuta hlokomologa tlhalošo
offset nomoro 10. Dipiksele go offset go tšwa godimo ge o bala boemo bja go phurolla.

Ditiragalo

Tiragalo Tlhalošo
tsenya tirišong Tiragalo ye e a tuka neng le neng ge selo se sefsa se thoma go šoma ke scrollspy.

Plugin ye e tlaleletša ka ka pela, ye e fetogago ya thepo le mošomo wa pilisi bakeng sa go fetoga ka dikagare tša selegae.

Download faele ya

Dithepo tša mohlala

Klika dithepo tše di lego ka mo tlase go fetoša magareng ga diphensele tše di utilwego, gaešita le ka dimenu tša go theoga.

Raw denim mohlomongwe ga se wa kwa ka bona jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth mong'a hloekisa. Ditedu cliche nakwana, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh mohlapetši wa ditoro synth. Cosby jesi eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone.. Ke nyaka go nyoba nnywana ya mosadi. Seitan aliquip quis cardigan liaparo tsa american, butcher 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.


Go diriša bootstrap-tab.js

Kgontšha dithepo tša dithepo ka javascript (thepo ye nngwe le ye nngwe e swanetše go tsenywa tirišong ka botee):

  1. $ ( '#Tab ya ka a' ). klika ( mosebetsi ( e ) { .
  2. e . thibelaDefault ();
  3. $ ( ena ). tab ( 'bontša' );
  4. }) .

O ka tsenya tirišong dithepo ka botee ka ditsela tše mmalwa:

  1. $ ( '# Tab ya ka a [href="#profaele"]' ). tab ( 'bontša' ); // Kgetha tab ka lebitso
  2. $ ( '#Tab ya ka a:pele' ). tab ( 'bontša' ); // Kgetha tab ya pele
  3. $ ( '# Tab ya ka a: ya mafelelo' ). tab ( 'bontša' ); // Kgetha tab ya ho qetela
  4. $ ( '# Tab ya ka li: eq (2) a' ). tab ( 'bontša' ); // Kgetha tab ya boraro (0-indexed) .

Go swaya

O ka tsenya tirišong go sepelasepela ga thepo goba pilisi ntle le go ngwala javascript efe goba efe ka go fo laetša data-toggle="tab"goba data-toggle="pill"godimo ga elemente. Go tlaleletša ka navle nav-tabsdiklase go thepo go ultla diriša setaele sa thepo ya bootstrap.

  1. <ul sehlopha = "nav nav-dithepo" >
  2. <li><a href = "#gae" data-toggle = "thepo" > Gae </a></li>
  3. <li><a href = "#profaele" data-toggle = "thepo" > Profaele </a></li>
  4. <li><a href = "#melaetša" data-toggle = "thepo" > Melaetša </a></li>
  5. <li><a href = "#dipeakanyo" data-toggle = "thepo" > Dipeakanyo </a></li>
  6. </ul>

Mekgwa ya go šoma

$ (). thepo ya

E tsenya tirišong elemente ya thepo le setshelo sa diteng. Tab e swanetše go ba le e ka ba a data-targetgoba a go hrefnepiša noutu ya setshelo ka go DOM.

  1. <ul sehlopha = "nav nav-dithepo" id = "Tab ya ka" >
  2. <li class = "mafolofolo" ><a href = "#gae" > Gae </a></li>
  3. <li><a href = "#profaele" > Profaele </a></li>
  4. <li><a href = "#melaetša" > Melaetša </a></li>
  5. <li><a href = "#dipeakanyo" > Dipeakanyo </a></li>
  6. </ul>
  7.  
  8. <div sehlopha = "tab-diteng" >
  9. <div sehlopha = "thepo-lefasetere le sebetsang" id = "gae" > ... </div>
  10. <div sehlopha = "thepo-lefasetere" id = "profaele" > ... </div>
  11. <div class = "tab-pane" id = "melaetša" > ... </div>
  12. <div sehlopha = "tab-pane" id = "dipeakanyo" > ... </div>
  13. </div> e
  14.  
  15. <sengwalwa>
  16. $ ( mosebetsi () { .
  17. $ ( '# Tab ya ka a: ya mafelelo' ). tab ( 'bontša' );
  18. }) .
  19. </script>

Ditiragalo

Tiragalo Tlhalošo
bontšha Tiragalo ye e thunya ka pontšho ya thepo, eupša pele ga ge thepo ye mpsha e bontšhitšwe. Šomiša event.targetle event.relatedTargetgo nepiša thepo ye e šomago le thepo ye e šomago ya peleng (ge e le gona) ka go latelelana.
e bontšhitšwe Tiragalo ye e thunya pontšhong ya thepo ka morago ga ge thepo e bontšhitšwe. Šomiša event.targetle event.relatedTargetgo nepiša thepo ye e šomago le thepo ye e šomago ya peleng (ge e le gona) ka go latelelana.
  1. $ ( 'a [data-toggle = "thepo"]' ). ka ( 'bontšhitšwe' , mošomo ( e ) { .
  2. e . sepheo // kenya tshebetsong tab
  3. e . relatedTarget // thepo ya peleng
  4. }) .

Mabapi le Dikeletšo tša Didirišwa

E hlohleleditšwe ke plugin ye botse kudu ya jQuery.tipsy yeo e ngwadilwego ke Jason Frame; Dikeletšo tša didirišwa ke phetolelo ye e mpshafaditšwego, yeo e sa ithekgego ka diswantšho, e šomiša css3 bakeng sa ditshwantšho tša go phela, le dika tša datha bakeng sa polokelo ya thaetlele ya selegae.

Download faele ya

Mohlala wa tšhomišo ya Tooltips

Beakanya godimo ga dikgokagano tše di lego ka mo tlase go bona ditšhišinyo tša didirišwa:

Tight pants next level keffiyeh mohlomongwe ga se wa kwa ka tšona. Photo lephephe ditedu tala denim letterpress vegan moromiwa mokotla stumptown. Polase-ho-tafoleng seitan, mcsweeney o fixie tšoarellang quinoa 8-bit american liaparo na le terry richardson vinyl chambray. Ditedu stumptown, di-cardigan banh mi lomo dikatse tša diaduma. Tofu biodiesel williamsburg marfa, tse 'nè loko mcsweeney o hloekisa vegan chambray. A hlile ironic artisan eng kapa eng keytar , scenester polasi-ho-tafoleng banksy Austin twitter sebetsana freegan cred tala denim e le 'ngoe-tšimoloho kofi kokoana-hloko.


Ka go diriša bootstrap-tooltip.js

Hlohleletša keletšo ya sedirišwa ka javascript:

  1. $ ( '#mohlala' ). tooltip ( dikgetho ) .

Dikgetho

Leina mohuta hlokomologa tlhalošo
ditshwantsho tse di phelang boolean ya go swana nnete diriša phetogo ya css fade go tooltip
go bewa ga dilo thapo|mošomo 'godimo' kamoo ho ka beha tooltip - holimo | tlase | le letšehali | nepagetše
mokgethi wa go kgetha thapo maaka Ge e le gore mokgethi o filwe, dilo tša keletšo ya sedirišwa di tla abelwa diphetho tše di laeditšwego.
thaetlele thapo ya | mošomo '' . boleng bja thaetlele ya go se fetoge ge e le gore leswao la `thaetlele` ga le gona
šušumetša thapo 'hover'. kamoo tooltip e hlohleletšwago ka gona - hover | go tsepamiša kgopolo | manyuale
diega nomoro ya | selo 0.

go diega go bontšha le go uta keletšo ya sedirišwa (ms) - ga e šome go mohuta wa go hlohleletša ka seatla

Ge e le gore nomoro e filwe, go diega go dirišwa go bobedi go uta/bontšha

Sebopego sa selo ke:delay: { show: 500, hide: 100 }

Dihlogo godimo! Dikgetho tša didirišwa tša motho ka o tee ka o tee di ka laetšwa ka tsela ye nngwe ka tšhomišo ya dika tša datha.

Go swaya

Ka mabaka a tshepedišo, Tooltip le Popover data-apis di kgetha go tsena Ge o rata go di šomiša e no laetša kgetho ya mokgethi.

  1. <a href = "#" rel = "keletšo ya sedirišwa" title = "keletšo ya sedirišwa ya mathomo" > bea godimo ga ka </a>

Mekgwa ya go šoma

$ (). tooltip (dikgetho) .

E kgomaretša sedirišwa sa go swara sedirišwa go kgoboketšo ya elemente.

.tooltip ('bontša') .

E utolla keletšo ya sedirišwa ya elemente.

  1. $ ( '# elemente' ). tooltip ( 'bontša' ) .

.tooltip ('pata') .

E uta keletšo ya sedirišwa ya elemente.

  1. $ ( '# elemente' ). tooltip ( 'pata' ) .

.sedirišwa ('toggle') .

E fetola keletšo ya sedirišwa ya elemente.

  1. $ ( '# elemente' ). keletšo ya sedirišwa ( 'toggle' ) .

Mabapi le di-popovers

Oketša dikhupetšo tše nnyane tša dikagare, go swana le tšeo di lego go iPad, go elemente efe goba efe ya go apa tshedimošo ya bobedi.

* E nyaka gore Tooltip e akaretšwe

Download faele ya

Mohlala hover popover

Hover godimo ga konope go hlohleletša popover.


Go diriša bootstrap-popover.js

Kgontšha di-popover ka javascript:

  1. $ ( '#mohlala' ). popover ( dikgetho ) .

Dikgetho

Leina mohuta hlokomologa tlhalošo
ditshwantsho tse di phelang boolean ya go swana nnete diriša phetogo ya css fade go tooltip
go bewa ga dilo thapo|mošomo 'nepagetše' kamoo ho ka beha popover - holimo | tlase | le letšehali | nepagetše
mokgethi wa go kgetha thapo maaka ge e le gore mokgethi o filwe, dilo tša keletšo ya sedirišwa di tla abelwa diphetho tše di laeditšwego
šušumetša thapo 'hover'. kamoo tooltip e hlohleletšwago ka gona - hover | go tsepamiša kgopolo | manyuale
thaetlele thapo ya | mošomo '' . boleng bja thaetlele ya go se fetoge ge e le gore seka sa `thaetlele` ga se gona
diteng thapo ya | mošomo '' . boleng bja diteng tša go se fetoge ge e le gore seka sa `data-content` ga se gona
diega nomoro ya | selo 0.

go diega go bontšha le go uta popover (ms) - ga e šome go mohuta wa go hlohleletša ka seatla

Ge e le gore nomoro e filwe, go diega go dirišwa go bobedi go uta/bontšha

Sebopego sa selo ke:delay: { show: 500, hide: 100 }

Dihlogo godimo! Dikgetho tša dipopovers ka botee di ka laetšwa ka tsela ye nngwe ka tšhomišo ya dika tša datha.

Go swaya

Ka mabaka a tshepedišo, Tooltip le Popover data-apis di kgetha go tsena Ge o rata go di šomiša e no laetša kgetho ya mokgethi.

Mekgwa ya go šoma

$ ().popover (dikgetho) .

E thoma di-popovers bakeng sa kgoboketšo ya elemente.

.popover('bontša') .

E senola e elements popover.

  1. $ ( '# elemente' ). popover ( 'bontša' ) .

.popover('pata') .

Pata e elements popover.

  1. $ ( '# elemente' ). popover ( 'pata' ) .

.popover ('fetola') .

Toggles e elements popover.

  1. $ ( '# elemente' ). popover ( 'go fetola' ) .

Mabapi le ditemošo

Plugin ya temošo ke sehlopha se senyenyane sa go oketša mošomo wa kgauswi go ditemošo.

Taonelouta

Ditemošo tša mohlala

Plugin ya ditemošo e šoma go melaetša ya temošo ya ka mehla, le melaetša ya go thibela.

Guacamole e kgethwa! Best check yo self, ga o bonagale gabotse kudu.

Ao snap! O hweditše phošo!

Fetoša se le sela gomme o leke gape. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus e dula amet fermentum.

Tšea kgato ye Goba dira se


Ka go diriša bootstrap-alert.js

Kgontšha go rakwa ga temošo ka javascript:

  1. $ ( ".temošo" ). temošo () .

Go swaya

E no oketša data-dismiss="alert"go konope ya gago ya go tswalela go fa ka go iketla mošomo wa go tswalela temošo.

  1. <a sehlopha = "tswalela" data-dismiss = "temošo" href = "#" > & dinako; </a>

Mekgwa ya go šoma

$ (). temošo () .

E phuthela ditemošo ka moka ka tšhomišo ya kgauswi. Go dira gore ditemošo tša gago di phele ge di tswaletšwe, kgonthiša gore di na le .fadele .insehlopha seo se šetšego se dirišitšwe go tšona.

.alert ('tswalela') .

E tswalela temošo.

  1. $ ( ".temošo" ). temošo ( 'tswalela' ) .

Ditiragalo

Sehlopha sa temošo sa Bootstrap se pepentšha ditiragalo tše mmalwa bakeng sa go goketša mošomong wa temošo.

Tiragalo Tlhalošo
tswalela Tiragalo ye e thunya ka pela ge closemokgwa wa mohlala o bitšwa.
e tswaletšwe Tiragalo ye e thuntšhwa ge temošo e tswaletšwe (e tla emela gore diphetogo tša css di phethe).
  1. $ ( '#temošo ya ka' ). tlama ( 'koaloa' , mosebetsi () {
  2. // dira se sengwe...
  3. }) .

Mabapi le

Dira mo gontši ka dikonope. Taolo konope e bolela goba hlama dihlopha tša dikonope bakeng sa dikarolo tše dingwe go swana le dibara tša didirišwa.

Download faele ya

Ditirišo tša mohlala

Sebelisa dikonopo plugin bakeng sa e re le toggles.

Stateful
Toggle e le nngwe
Lepokisi la go hlahloba
Seyalemoya

Ka go diriša bootstrap-button.js

Kgontšha dikonope ka javascript:

  1. $ ( '.nav-dithepo' ). konopo () .

Go swaya

Dika tša data ke tša bohlokwa go plugin ya konope. Lekola khoutu ya mohlala ka mo tlase bakeng sa mehuta e fapa-fapanego ya go swaya.

  1. <!-- Oketša data-toggle="konope" go tsenya tirišong go fetola go konope e tee -->
  2. < sehlopha sa konopo = "btn" data-toggle = "konopo" > Fetola e le 'ngoe </konopo>
  3.  
  4. <!-- Oketša data-toggle="buttons-checkbox" bakeng sa go fetola setaele sa lepokisi la go hlahloba go btn-group -->
  5. <div sehlopha = "btn-sehlopha" ya data-toggle = "dikonopo-lebokose la hlahloba" >
  6. < sehlopha sa konopo = "btn" > Letsohong le letšehali </konopo>
  7. < sehlopha sa konopo = "btn" > Bohareng </konopo>
  8. < sehlopha sa konopo = "btn" > Tokelo ya </konopo>
  9. </div> e
  10.  
  11. <!-- Oketša data-toggle="buttons-radio" bakeng sa go fetola setaele sa radio go btn-group -->
  12. <div sehlopha = "btn-sehlopha" ya data-toggle = "dikonopo-radio" >
  13. < sehlopha sa konopo = "btn" > Letsohong le letšehali </konopo>
  14. < sehlopha sa konopo = "btn" > Bohareng </konopo>
  15. < sehlopha sa konopo = "btn" > Tokelo ya </konopo>
  16. </div> e

Mekgwa ya go šoma

$ (). konopo ( 'toggle') .

Toggles kgorometsa boemo. E fa konope ponagalo ya gore e tsentšwe tirišong.

Dihlogo godimo! O ka kgontšha go fetoša ka go itiriša ga konope ka go šomiša data-toggleseka.
  1. < sehlopha sa konopo = "btn" data-toggle = "konopo" > ... </konopo>

$ (). konopo ( 'ho laela') .

E beakanya boemo bja konope go laetša - e šitiša konope le go fapantšha sengwalwa go laetša sengwalwa. Go laetša sengwalwa go swanetše go hlalošwa godimo ga elemente ya konope ka go šomiša seka sa datha data-loading-text.

  1. <button class = "btn" data-loading-text = "go laetša dilo ..." > ... </konope>
Dihlogo godimo! Firefox e phegelela boemo bjo bo golofetšego go ralala le merwalo ya matlakala . Tsela ya go rarolla se ke go diriša autocomplete="off".

$ (). konopo ( 'reset') .

E beakanya gape boemo bja konope - e fapantšha sengwalwa go sengwalwa sa mathomo.

$ (). konopo (khoele) .

E beakanya gape boemo bja konope - e fapantšha sengwalwa go seemo sefe goba sefe sa sengwalwa seo se hlalošitšwego sa datha.

  1. < sehlopha sa konopo = "btn" ya data-e feletseng-sengwalwa = "e qeta!" > ... </konope>
  2. <sengwalwa>
  3. $ ( '.bt n ' ) ) . konopo ( 'e feletseng' ) .
  4. </script>

Mabapi le

Hwetša mekgwa ya motheo le thekgo ye e fetofetogago ya dikarolo tše di phuhlamago go swana le di-accordion le go sepelasepela.

Download faele ya

* E nyaka gore plugin ya Diphetogo e akaretšwe.

Mohlala wa accordion

Ka go diriša plugin ya go phuhlama, re ile ra aga sedirišwa se bonolo sa setaele sa accordion:

Anim pariatur cliche reprehenderit, enim eiusmod bophelo bo phahameng accusamus terry richardson papatso squid. 3 phiri ngwedi officia aute, bao e seng cupidat skateboard dolor brunch. Tereka ya dijo quinoa nesciunt laborum eiusmod. Brunch 3 phiri ngwedi tempor, sunt aliqua beha nonyana ka eona squid e le 'ngoe-tšimoloho kofi nulla assumenda shoreditch et. Nihil ani keffiyeh helvetica, mošomo wa diatla wa biri wa go šoma ka diatla wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur nama motlatsi lomo. Leggings occaecat craft biri polasi-ho-tafoleng, tala denim aesthetic synth nesciunt mohlomong ha ua utloa ka bona accusamus labore tšoarellang VHS.
Anim pariatur cliche reprehenderit, enim eiusmod bophelo bo phahameng accusamus terry richardson papatso squid. 3 phiri ngwedi officia aute, bao e seng cupidat skateboard dolor brunch. Tereka ya dijo quinoa nesciunt laborum eiusmod. Brunch 3 phiri ngwedi tempor, sunt aliqua beha nonyana ka eona squid e le 'ngoe-tšimoloho kofi nulla assumenda shoreditch et. Nihil ani keffiyeh helvetica, mošomo wa diatla wa biri wa go šoma ka diatla wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur nama motlatsi lomo. Leggings occaecat craft biri polasi-ho-tafoleng, tala denim aesthetic synth nesciunt mohlomong ha ua utloa ka bona accusamus labore tšoarellang VHS.
Anim pariatur cliche reprehenderit, enim eiusmod bophelo bo phahameng accusamus terry richardson papatso squid. 3 phiri ngwedi officia aute, bao e seng cupidat skateboard dolor brunch. Tereka ya dijo quinoa nesciunt laborum eiusmod. Brunch 3 phiri ngwedi tempor, sunt aliqua beha nonyana ka eona squid e le 'ngoe-tšimoloho kofi nulla assumenda shoreditch et. Nihil ani keffiyeh helvetica, mošomo wa diatla wa biri wa go šoma ka diatla wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur nama motlatsi lomo. Leggings occaecat craft biri polasi-ho-tafoleng, tala denim aesthetic synth nesciunt mohlomong ha ua utloa ka bona accusamus labore tšoarellang VHS.

Go diriša bootstrap-collapse.js

Kgontšha ka javascript:

  1. $ ( ".e phuhlama" ). go phuhlama () .

Dikgetho

Leina mohuta hlokomologa tlhalošo
motswadi mokgethi wa go kgetha maaka Ge e le gore mokgethi gona dielemente ka moka tše di phuhlamago ka fase ga motswadi yo a laeditšwego di tla tswalelwa ge selo se se se phuhlamago se bontšhwa. (e swanago le boitshwaro bja setšo bja accordion) .
go fetola boolean ya go swana nnete Toggles elements collapsible ka pitso

Go swaya

E no tlaleletša data-toggle="collapse"le data-targetgo elemente go abela ka go iketla taolo ya elemente ye e phuhlamago. Sebopego data-targetse amogela mokgethi wa css go diriša go phuhlama go yena. Kgonthiša gore o tlaleletša sehlopha collapsego elemente ye e phuhlamago. Ge e ba o rata gore e bulege ka go ikemela, oketša sehlopha sa tlaleletšo in.

  1. < sehlopha sa konopo = "btn btn-kotsi" ya data-toggle = "ho phuhlama" ya data-sepheo = "# demo" >
  2. bonolo collapsible
  3. </konope>
  4.  
  5. <div id = "demo" sehlopha = "phuhlama ka" > ... </div>
Dihlogo godimo! Go oketša taolo ya sehlopha ya go swana le accordion go taolo ye e phuhlamago, oketša seka sa datha data-parent="#selector". Lebelela demo go bona se se šoma.

Mekgwa ya go šoma

.collapse(dikgetho) .

E dira gore diteng tša gago di šome bjalo ka elemente ye e phuhlamago. E amogela dikgetho tša boikhethelo object.

  1. $ ( '# e ka phuhlamang ya ka' ). go phuhlama ({
  2. toggle : maaka
  3. }) .

.collapse ('fetola') .

E fetola elemente ye e phuhlamago go bontšhwa goba ye e utilwego.

.collapse ('bontša') .

E bontšha elemente yeo e ka phuhlamago.

.collapse('pata') .

Pata elemente e phuhlamang.

Ditiragalo

Sehlopha sa go phuhlama sa Bootstrap se pepentšha ditiragalo tše mmalwa tša go goketša ka mošomo wa go phuhlama.

Tiragalo Tlhalošo
bontšha Tiragalo ye e thunya ka pela ge showmokgwa wa mohlala o bitšwa.
e bontšhitšwe Tiragalo ye e thuntšhwa ge elemente ya go phuhlama e dirilwe gore e bonagale go modiriši (e tla emela gore diphetogo tša css di phethe).
fihla Tiragalo ye e thuntšhwa ka pela ge hidemokgwa o biditšwe.
fihlilwe Tiragalo ye e thuntšhwa ge elemente ya go phuhlama e utilwe go tšwa go modiriši (e tla emela gore diphetogo tša css di phethe).
  1. $ ( '# e ka phuhlamang ya ka' ). ka ( 'e patiloeng' , mosebetsi () {
  2. // dira se sengwe...
  3. }) .

Mabapi le

Plugin ya motheo, yeo e katološitšwego gabonolo bakeng sa go hlama ka pela di-typeahead tša maemo ka tsenyo efe goba efe ya sengwalwa sa foromo.

Download faele ya

Mohlala

Thoma go thaepa ka tšhemong ye e lego ka mo tlase go bontšha dipoelo tša go thaepa pele.


Go diriša bootstrap-typeahead.js

Bitsa typeahead ka javascript:

  1. $ ( '.thaepa pele' ). typeahead () .

Dikgetho

Leina mohuta hlokomologa tlhalošo
mothopo hlophisitsoeng [ ] . Mothopo wa datha wo o swanetšego go botšiša kgahlanong le wona.
diaetheme nomoro 8. Palo ya godimo ya dilo tšeo di swanetšego go bontšhwa ka go theoga.
matcher mošomo go hloka kwelobohloko ya ditlhaka tše kgolo Mokgwa wo o šomišwago go bona ge eba potšišo e swana le selo. E amogela ngangišano e tee, itemyeo e swanetšego go leka potšišo kgahlanong le yona. Fihlelela potšišo ya bjale ka this.query. Bušetša boolean truege e le gore potšišo e le go swana.
mohlophisi mošomo go swana ka go nepagala,
go se na kwelobohloko ya ditlhaka tše kgolo le
ditlhaka tše kgolo
Mokgwa wo o šomišwago go hlopha dipoelo tša go tlatša ka go itiragalela. E amogela ngangišano e tee itemsgomme e na le sebaka sa mohlala wa typeahead. Tšhupetšo ya potšišo ya bjale ka this.query.
se hlalositsoeng mošomo e gatelela dipapadi ka moka tša go se fetoge Mokgwa wo o šomišwago go tšweletša dipoelo tša go tlatša ka go itiragalela. E amogela ngangišano e tee itemgomme e na le sebaka sa mohlala wa typeahead. E swanetše go bušetša html.

Go swaya

Oketša dika tša datha go ngwadiša elemente ka mošomo wa typeahead.

  1. < mohuta wa tsenyo = "sengwalwa" data-fana = "typeahead" >

Mekgwa ya go šoma

.typeahead(dikgetho) .

E thoma tsenyo ka typeahead.