An ka Modal plugin ye super slim take ye traditional modal js plugin kan, k'an janto kɛrɛnkɛrɛnnenya la ka baarakɛcogo jɛlen dɔrɔn de Dòn an fɛ yan twitter kan.

Ka telesarize

Baara kɛ ni bootstrap-modal ye

$ ( '#n ka-modal' ). modal ( sugandiliw ) .

Sugandili minnu bɛ kɛ

Tɔ̀gɔ	ka sɛbɛen masin na	fɔlɔ	cogojirali
kɔkannakow	boolean, juru	nkalon	Modal-backdrop element dɔ bɛ a kɔnɔ. Set backdrop to "static"ni i t’a fɛ modal ka datugu ni backdrop digilen don.
klaviyeti ye	boolean ye	nkalon	A bɛ modal da tugu ni escape key digilen don
k'a jira	boolean ye	nkalon	A bɛ modal da wuli kalan daminɛ kan

Markup (Marka) ye

I bɛ Se ka modɛliw baara i ka ɲɛ kan nɔgɔya la k’a sɔrɔ i ma javascript sɛrɛ kelen sɛbɛn. Dɔrɔn ka fɛn dɔ Di fɛn dɔ ma data-controls-modalmin bɛ Bɛn ni modal element id ye, n’i y’a digi, a bɛ i ka modal daminɛ. Walasa ka modal sugandiliw Fàra ɲɔgɔn kan, i k’u Dòn dɔrɔn i n’a fɔ data attributes fana.

<a class = "btn" data-controls-modal = "ne-modal" data-backdrop = "static" > Modal daminɛ </a>    

Kɔlɔsili N’i b’a fɛ i ka modal ka animation in and out, i ka .fadeclasse dɔ fara i ka .modalelement kan dɔrɔn (aw ye demo lajɛ walasa k’o ye wale la).

Fɛɛrɛw

.modal(sugandiliw) .

A bɛ i ka kɔnɔkow baara i n’a fɔ modal. A bɛ sɔn sugandiliw ma minnu bɛ se ka kɛ object.

$ ( '#n ka-modal' ). modɛli ({
  klaviyeti : tiɲɛ don 
})

.modal('toggle') .

A bɛ modal dɔ wuli ni bolo ye.

$ ( '#n ka-modal' ). modali ( 'toggle' ) .

.modal(' jira')

A bɛ modal dɔ da wuli ni bolo ye.

$ ( '#n ka-modal' ). modal ( 'jira' ) .

.modal('ka dogo')

A bɛ modal dɔ dogo ni bolo ye.

$ ( '#n ka-modal' ). modal ( 'dogo' ) .

.modal(tiɲɛ) .

A bɛ segin elements modal class instance dɔ kan.

$ ( '#n ka-modal' ). modal ( tiɲɛ ) .

Kɔlɔsili Ni o tɛ, nin bɛ se ka sɔrɔ ni $().data('modal').

Ko minnu kɛra

Bootstrap ka modal class bɛ ko damadɔw jira kɛnɛ kan walasa ka hooking kɛ modal baarakɛcogo la.

Lajɛrɛ	Cogojirali
k'a jira	O ko in bɛ tasuma Bɔ o yɔrɔnin bɛɛ ni showmisali fɛɛrɛ Weelera.
jiralen don	O ko in bɛ Fɔ ni modal Kɛra ka Ye baarakɛla fɛ (a bɛna css 'tɛmɛsiraw makɔnɔ ka Dafa).
ka dogo	O ko in bɛ Fɔ o yɔrɔnin bɛɛ ni hidemisali fɛɛrɛ Weelera.
dogolen	O ko in bɛ Fɔ ni modal ye dogolen Ban baarakɛla la (a bɛna css transitions makɔnɔ ka ban).

$ ( '#n ka-modal' ). bind ( 'dogolen' , baara () { .   
  // ka fɛn dɔ kɛ ...
})

Demo

Lancement Modal

Nin 'plugin in ye 'sènfɛ-sɛbɛnni-minɛnw Fàrala bootstrap sanfɛ-yɔrɔ kan walima tablɛ-yɔrɔw kan.

Ka telesarize

Baara kɛ ni bootstrap-dropdown.js ye

$ ( '#sanfɛ-baro' ). jiginɛ () .

Markup (Marka) ye

Walasa ka teliya ka dropdown baarakɛcogo fara nav element o nav element kan, baara kɛ ni data-dropdownattribute ye. Bootstrap dropdown min bɛ se ka kɛ, o bɛna baara kɛ a yɛrɛma.

<ul kalasi = "tabu" > 
  <li kalasi = "baarakɛla" ><a href = "#" > So </a></li>  
  <li kalasi = "jigin" data-dropdown = "jigin" >   
    <a href = "#" class = "dakun-toggle" > Jiginni </a>  
    <ul kalasi = "dakun-yɔrɔ" > 
      <li><a href = "#" > Jɛɲɔgɔnya filanan </a></li> 
      <li><a href = "#" > fɛn wɛrɛ bɛ yan </a></li> 
      <li kalasi = "jatebɔlan" </li> 
      <li><a href = "#" > Jɛɲɔgɔnya wɛrɛ </a></li> 
    </ul>
  </li>
</ul>

Kɔlɔsili Ni i ka ui bɛ ni fɛn caman ye minnu bɛ jigin, i ka jateminɛ kɛ data-dropdownka fɛn dɔ fara minɛn kɔnɔfɛn dɔ kan min nafa ka bon kosɛbɛ i n’a fɔ .tabswalima .topbar.

Fɛɛrɛw

$().dɔgɔtɔrɔso() .

Api programatic min bɛ menuw baara ka ɲɛsin topbar walima tabbed navigation dilen dɔ ma.

Demo

Nin fɛn in ye scrollspy (auto updating nav) jɛɲɔgɔnya farali ye bootstrap sanfɛyɔrɔ kan.

Ka telesarize

Baara kɛ ni bootstrap-scrollspy.js ye

$ ( '#sanfɛ-baro' ). scrollSpy () .

Markup (Marka) ye

Walasa ka scrollspy kɛcogo fara nɔgɔya la i ka nav kan, i ka data-scrollspyattribute fara dɔrɔn .topbar.

<div kalasi = "sanfɛ-baara" data-scrollspy = "scrollspy" > ... </div>   

Fɛɛrɛw

$().scrollSpy () Bamako, Mali.

Auto bɛ navigation buttons baara ka kɛɲɛ ni baarakɛlaw ka scroll position ye.

$ ( 'farikolo > .sanfɛ-yɔrɔ' ). scrollSpy () .

Kɔlɔsili Topbar anchor tags ka kan ka kɛ ni id laɲiniw ye minnu bɛ se ka ɲɛnabɔ. Misali la, a <a href="#home">home</a>ka kan ka bɛn fɛn dɔ ma dom kɔnɔ i n’a fɔ <div id="home"></div>.

.scrollSpy('lakuraya')

Scrollspy bɛ nav butɔni ni dakun koordinatɛriw mara walasa ka baara kɛ. N’i ​​mago bɛ ka nin cache in kuraya (a ka c’a la n’i bɛ ni kɔnɔkow dinamiki ye) i ka nin refresh fɛɛrɛ in wele dɔrɔn. N’i ​​ye baara Kɛ ni data attribute ye walasa k’i ka scrollspy ɲɛfɔ, i bɛ refresh Weele dɔrɔn farikolo kan.

$ ( 'farikolo' ). scrollSpy ( 'lakuraya' ) .

Demo

Aw ye the topbar navigation lajɛ nin ɲɛ in kan.

Nin plugin in bɛ baarakɛcogo wɛrɛw Di butɔni cogoya ɲɛnabɔli kama.

Ka telesarize

Baara kɛ ni bootstrap-buttons.js ye

$ ( '.tabs' ). butɔni () .

Fɛɛrɛw

$().button('toggle') Bamako, Mali.

Toggles push jamana. A bɛ btn di a ma ko a bɛ activer.

Kɔlɔsili Aw bɛ se ka butɔni dɔ ka auto toggling kɛ ni baara ye ni data-toggleattribut ye.

<butɔni kalasi = "btn" data-toggle = "toggle" > ... </button>   

$().button('ka doni')

A bɛ butɔni cogoya sigi doni na - a bɛ butɔni bali ani ka sɛbɛnniw ɲɔgɔn falen ka sɛbɛnniw doni. sɛbɛnniw doni ka kan ka ɲɛfɔ butɔni yɔrɔ kan ni data attribute ye data-loading-text.

<button class = "btn" data-loading-text = "fɛnw doni..." > ... </button>   

$().button('segin') .

A bɛ butɔni cogoya lasegin - a bɛ sɛbɛnniw falen-falen ka kɛ sɛbɛn fɔlɔ ye.

$().button(sɛgɛsɛgɛli) .

A bɛ butɔni cogoya lasegin - a bɛ sɛbɛnniw ɲɔgɔn falen-falen ka kɛɲɛ ni sɛbɛnni cogoya o kunnafoni ɲɛfɔlen ye.

<button class = "btn" kunnafoni-dafalen-sɛbɛn = "ban!" > ... </butɔni>   
<sɛbɛnni>
  $('.btn').button('dafalen')
</scrip> ye

Demo

Demo ka chargement Toggle ka Demo

Nin plugin in bɛ tab ni pill baarakɛcogo teliyalen, fangama dɔ fara a kan.

Ka telesarize

Baara kɛ ni bootstrap-tabs.js ye

$ ( Bamako ) . '.tabs' ). tabali () .

Markup (Marka) ye

Aw bɛ se ka tab walima furakisɛ navigatiɔn dɔ baara k’a sɔrɔ aw ma javascript si sɛbɛn ni aw ye a di u ma dɔrɔndata-tabs walima data-pillsattribut di u ma dɔrɔn.

 <ul kalasi = "tablo" data-tabs = "tabs" .    > ... </ul>

Fɛɛrɛw

$().tabs walima $().furakisɛw

A bɛ tab ni furakisɛ baarakɛcogo baara minɛn dilen dɔ kama. Tab links ka kan ka id's jira sɛbɛn kɔnɔ.

<ul kalasi = "tabu". >
  <li kalasi = "baarakɛ" ><a href = "#so" > So   </a></li>
  <li><a href = "#profil" > Ɲɛjirali </a></li> 
  <li><a href = "#cikanw" > Cikanw </a></li> 
  <li><a href = "#settings" > Labɛnw  </a></li>
</ul>
 
<div kalasi = "furakisɛ-kɔnɔfɛnw".  >
  <div kalasi = "baarakɛ" id = "so" > ...   </div>
  <div id = "porofayili" > ... </div> 
  <div id = "cikanw" > ... </div> 
  <div id = "labɛnw" > ...  </div>
</div> ye
 
<sɛbɛnni>
  $ ( baarakɛcogo () .   { .
    $ ( '.tabs' ). tabali () .
  })
</script> ye

Ko minnu kɛra

Lajɛrɛ	Cogojirali
ka yɛlɛma	Nin ko in bɛ tasuma don tab caman cili la. Baara kɛ event.targetni ani event.relatedTargetye walasa ka tab baarakɛta ni tab baarakɛta tɛmɛnenw laɲini.

$ ( '#.tabs' ). bind ( 'yɛlɛma' , baara ( e ) { .   
  e . laɲini // tab min bɛ baara kɛ
  e . relatedTarget // tab tɛmɛnen
})

Demo

• So
• Porofili
• Cikanw
• Settings (Labɛnw).
• Dropdown (Donkilidala).
  • @belebeleba
  • @mdo ye

A sinsinnen bɛ jQuery.tipsy plugin ɲumanba kan min sɛbɛnna Jason Frame fɛ; twipsy ye sɛgɛsɛgɛli kura ye, min tɛ a jigi da jaw kan, a bɛ baara kɛ ni css3 ye animationw kama, ani data-attributes ye title marali kama!

Ka telesarize

Baara kɛ ni bootstrap-twipsy.js ye

$ ( '#misali' ). twipsy ( sugandiliw ) .

Sugandili minnu bɛ kɛ

Tɔ̀gɔ	ka sɛbɛen masin na	fɔlɔ	cogojirali
animation (ɲɛnamaya kɛ).	boolean ye	sɛbɛ	css fade transition dɔ kɛ baarakɛminɛnw kɔnɔ
delayIn	nimɔrɔ	0 ye	delay ka sɔrɔ ka baarakɛminɛnw jira (ms) .
delayOut (ka waati latɛmɛ).	nimɔrɔ	0 ye	delay ka sɔrɔ ka baarakɛminɛnw dogo (ms) .
fallback (fɔlikan).	gaari	'' '' .	sɛbɛnni min bɛ kɛ ni baarakɛminɛnw tɔgɔ tɛ yen
bilali sen kan	gaari	'sanfɛ'	baarakɛminɛnw bilacogo - sanfɛ | duguma | kinin fɛ | jo
html ye	boolean ye	nkalon	bɛ sira Di html kɔnɔkow ma baarakɛminɛnw kɔnɔ
ka balo	boolean ye	nkalon	baara kɛ ni ko kɛlenw cicogo ye ko kɛlenw ɲɛnabɔbaga kelen-kelenw nɔ na
offset (fɔcogo ɲuman).	nimɔrɔ	0 ye	pixel offset of tooltip ka bɔ laɲini yɔrɔ la
titiri	sɛrɛ, baarakɛcogo	'titiri'	attribut walima fɛɛrɛ min bɛ kɛ ka title text sɔrɔ
ka ci	gaari	'hover' ye.	baarakɛminɛnw bɛ daminɛ cogo min na - hover | sinsinnan | min bɛ fɛn bolo la
jatebɔlan	gaari	[taamaʃyɛn fɔlɔ] .	html jatebɔlan min bɛ kɛ ka twipsy dɔ jira.

Kɔlɔsili Twipsy instance sugandiliw kelen-kelen bɛɛ bɛ se ka ɲɛfɔ cogo wɛrɛ la ni data attributes baara ye.

<a href = "#" data-placement = "jukɔrɔ" rel = 'twipsy' title = 'Title sɛbɛn dɔw' > sɛbɛnni </a>    

Fɛɛrɛw

$().twipsy(sugandiliw) .

A bɛ twipsy handler dɔ siri element collection dɔ la.

.twipsy(' jira')

A bɛ elements twipsy dɔ jira.

$ ( '#fɛn' ). twipsy ( 'jira' ) .

.twipsy('ka dogo')

A bɛ fɛn dɔ dogo twipsy.

$ ( '#fɛn' ). twipsy ( 'dogo' ) .

.twipsy(tiɲɛ) .

A bɛ segin elements twipsy class instance dɔ kan.

$ ( '#fɛn' ). twipsy ( tiɲɛ ) .

Kɔlɔsili Ni o tɛ, nin bɛ se ka sɔrɔ ni $().data('twipsy').

Demo

Popover plugin bɛ 'interface nɔgɔman Di walasa ka popovers Fàra i ka application kan. A bɛ bootstrap-twipsy.js plugin janya, o la aw k’aw jija k’o filen in fana minɛ ni popovers bɛ don aw ka porozɛ kɔnɔ!

Kɔlɔsili Aw ka kan ka bootstrap-twipsy.js filen don a kɔnɔ ka kɔn bootstrap-popover.js ɲɛ.

Ka telesarize

Baara kɛ ni bootstrap-popover.js ye

$ ( '#misali' ). popover ( sugandiliw ) .

Sugandili minnu bɛ kɛ

Tɔ̀gɔ	ka sɛbɛen masin na	fɔlɔ	cogojirali
animation (ɲɛnamaya kɛ).	boolean ye	sɛbɛ	css fade transition dɔ kɛ baarakɛminɛnw kɔnɔ
delayIn	nimɔrɔ	0 ye	delay ka sɔrɔ ka baarakɛminɛnw jira (ms) .
delayOut (ka waati latɛmɛ).	nimɔrɔ	0 ye	delay ka sɔrɔ ka baarakɛminɛnw dogo (ms) .
fallback (fɔlikan).	gaari	'' '' .	sɛbɛnni min bɛ kɛ ni baarakɛminɛnw tɔgɔ tɛ yen
bilali sen kan	gaari	'jo'	baarakɛminɛnw bilacogo - sanfɛ | duguma | kinin fɛ | jo
html ye	boolean ye	nkalon	bɛ sira Di html kɔnɔkow ma baarakɛminɛnw kɔnɔ
ka balo	boolean ye	nkalon	baara kɛ ni ko kɛlenw cicogo ye ko kɛlenw ɲɛnabɔbaga kelen-kelenw nɔ na
offset (fɔcogo ɲuman).	nimɔrɔ	0 ye	pixel offset of tooltip ka bɔ laɲini yɔrɔ la
titiri	sɛrɛ, baarakɛcogo	'titiri'	attribut walima fɛɛrɛ min bɛ kɛ ka title text sɔrɔ
kɔnɔnafɛn	sɛrɛ, baarakɛcogo	'daɲɛ-kɔnɔfɛnw'.	sɛrɛ walima fɛɛrɛ min bɛ kɛ ka kɔnɔkow sɛbɛnniw sɔrɔ. ni u si ma di, kɔnɔkow bɛna bɔ kunnafoni-kɔnɔkow fɛnsɛbɛn dɔ la.
ka ci	gaari	'hover' ye.	baarakɛminɛnw bɛ daminɛ cogo min na - hover | sinsinnan | min bɛ fɛn bolo la
jatebɔlan	gaari	[taamaʃyɛn fɔlɔ] .	html jatebɔlan min bɛ kɛ ka popover dɔ jira.

Kɔlɔsili Popover instance sugandiliw kelen-kelen bɛɛ bɛ se ka ɲɛfɔ cogo wɛrɛ la ni data attributes baara ye.

<a data-placement = "jukɔrɔ" href = "#" kalasi = "btn farati" rel = "popover" > sɛbɛnni </a>    

Fɛɛrɛw

$().popover(sugandiliw) .

A bɛ popovers daminɛ ka ɲɛsin element collection dɔ ma.

.popover(' jira')

A bɛ elements popover dɔ jira.

$ ( '#fɛn' ). popover ( 'jira' ) .

.popover('ka dogo')

A bɛ dogo ni elements popover ye.

$ ( '#fɛn' ). popover ( 'dogo' ) .

Demo

hover ka popover kɛ

Alert plugin ye super tiny class ye min bɛ kɛ ka close functionality fara alerts kan.

Ka telesarize

Baara kɛ ni bootstrap-alerts.js ye

$ ( ".kɔlɔsili-cikan" ). lasɔmini () .

Markup (Marka) ye

Dɔrɔn ka fɛn dɔ fara data-alerti ka lasɔmini cikanw kan walasa ka baarakɛcogo surun di u ma u yɛrɛma.

Sugandili minnu bɛ kɛ

Tɔ̀gɔ	ka sɛbɛen masin na	fɔlɔ	cogojirali
sugandilikɛla	gaari	'.ka datugu'	Sugandilikɛlan jumɛn ka kan ka laɲini walasa ka lasɔmini dɔ dadon.

Fɛɛrɛw

$().alert() ye.

A bɛ lasɔminiw bɛɛ siri ni baarakɛcogo surun ye. Walasa i ka lasɔminiw ka ɲɛnamaya kɛ ni u datugulen don, i k’a lajɛ k’u ka .fadeand .inclass (kalanso) bɛ u kan kaban.

.alert('daga')

A bɛ lasɔmini dɔ datugu.

$ ( ".kɔlɔsili-cikan" ). alert ( 'dakun' ) .

Demo