ʻO kā mākou Modal plugin he mea ʻoi loa ka lawe ʻana i ka plugin modal js kuʻuna, e mālama pono i ka hoʻopili ʻana i nā hana ʻole a mākou e koi ai ma twitter.

Hoʻoiho

Ke hoʻohana nei i ka bootstrap-modal

$ ( '#my-modal' ). modal ( koho )

Nā koho

inoa	ʻano ʻano	paʻamau	wehewehe
kāʻei kua	boolean	wahahee	Loaʻa i kahi ʻāpana modal-backdrop
keyboard	boolean	wahahee	Pani i ka modal ke kaomi ʻia ke kī pakele
hōʻike	boolean	wahahee	Wehe i ka modal ma ka hoʻomaka ʻana o ka papa

Markup

Hiki iā ʻoe ke hoʻoikaika i nā modals ma kāu ʻaoʻao me ka ʻole e kākau i hoʻokahi laina o javascript. Hāʻawi wale i kahi mea i kahi data-controls-modalʻano e pili ana i kahi id element modal, a ke kaomi ʻia, e hoʻomaka ia i kāu modal. No ka hoʻohui ʻana i nā koho modal, e hoʻopili wale iā lākou ma ke ʻano he ʻikepili ʻikepili pū kekahi.

<a class = "btn" data-controls-modal = "my-modal" data-backdrop = "true" > Launch Modal </a>    

Hoʻomaopopo Inā makemake ʻoe i kāu modal e animate i loko a i waho, e hoʻohui wale i kahi .fadepapa i kāu .modalmea (e nānā i ka demo e ʻike i kēia i ka hana).

Nā ʻano hana

.modal(koho)

Ho'ā i kāu ʻike ma ke ʻano he modal. ʻAe i kahi koho koho object.

$ ( '#my-modal' ). ʻano ({
  closeOnEscape : ʻoiaʻiʻo 
})

.modal('hoʻololi')

Hoʻololi lima i kahi ʻano.

$ ( '#my-modal' ). modal ( 'hoʻololi' )

.modal('hōʻike')

Wehe lima ʻia kahi modal.

$ ( '#my-modal' ). modal ( 'hōʻike' )

.modal('huna')

Hūnā lima ʻia kahi ʻano.

$ ( '#my-modal' ). modal ( 'huna' )

.modal(ʻoiaʻiʻo)

Hoʻihoʻi i kahi laʻana papa modal element.

$ ( '#my-modal' ). modal ( ʻoiaʻiʻo )

Hoʻomaopopo ʻO kahi ʻē aʻe, hiki ke kiʻi hou ʻia me $().data('modal').

Nā hanana

Hōʻike ka papa modal Bootstrap i kekahi mau hanana no ka hoʻopili ʻana i ka hana modal.

Hanana	wehewehe
hōʻike	Hoʻomaka koke kēia hanana i ke showkāhea ʻia ʻana o ke ʻano hana.
hōʻike ʻia	Hoʻopau ʻia kēia hanana i ka wā i ʻike ʻia ai ka modal e ka mea hoʻohana (e kali no ka hoʻopau css e hoʻopau).
huna	Hoʻopau koke ʻia kēia hanana i ka wā hidei kāhea ʻia ai ke ʻano hana.
hunaia	Hoʻopau ʻia kēia hanana i ka pau ʻana o ka huna ʻana o ka modal mai ka mea hoʻohana (e kali no ka hoʻololi ʻana o css).

$ ( '#my-modal' ). hoʻopaʻa ( 'huna' , hana () {   
  // hana i kekahi mea ...
})

Demo

Hoʻokuʻu i ka Modal

ʻO kēia plugin no ka hoʻohui ʻana i ka launa pū ʻana i ka bootstrap topbar a i ʻole nā ​​​​hoʻokele tabbed.

Hoʻoiho

Ke hoʻohana nei i ka boostrap-dropdown.js

$ ( '#topbar' ). hāʻule iho ()

Markup

No ka hoʻohui wikiwiki ʻana i ka hana hāʻule iho i kekahi mea nav, e hoʻohana i ke data-dropdownʻano. E ho'ā 'akomi 'ia ka hā'ule iho o ka bootstrap kūpono.

<ul class = "nā papa" > 
  <li class = "active" ><a href = "#" > Home </a></li>  
  <li class = "dropdown" data-dropdown = "dropdown" >   
    <a href = "#" class = "dropdown-toggle" > Dropdown </a>  
    <ul class = "dropdown-menu" > 
      <li><a href = "#" > Loulou lua </a></li> 
      <li><a href = "#" > He mea ʻē aʻe ma ʻaneʻi </a></li> 
      <li class = "divider" ></li> 
      <li><a href = "#" > Kekahi loulou </a></li> 
    </ul>
  </li>
</ul>

' Ōlelo Aʻo Inā he nui nā hāʻule iho o kāu ui, e noʻonoʻo e hoʻohui i ke ʻano data-dropdowni kahi mea ipu nui e like me a i .tabsʻole .topbar.

Nā ʻano hana

$(). dropdown()

He polokalamu api no ka hoʻonā ʻana i nā menus no kahi papa luna i hāʻawi ʻia a i ʻole ka hoʻokele tabbed.

Demo

ʻO kēia plugin no ka hoʻohui ʻana i ka pilina scrollspy (auto updating nav) i ka bootstrap topbar.

Hoʻoiho

Ke hoʻohana nei i boostrap-scrollspy.js

$ ( '#topbar' ). hāʻule iho ()

Markup

No ka hoʻohui maʻalahi i ka hana scrollspy i kāu nav, e hoʻohui wale i ke data-scrollspyʻano i ka .topbar.

<div class = "topbar" data-scrollspy = "scrollspy" > ... </div>   

Nā ʻano hana

$().scrollspy()

Ho'ā 'akomi i nā pihi hoʻokele e nā mea hoʻohana i ke kūlana scroll.

$ ( 'kino > .topbar' ). scrollSpy ()

E hoʻomaopopo i nā hōʻailona heleuma Topbar pono e hoʻoholo i nā pahuhopu id. No ka laʻana, <a href="#home">home</a>pono e pili i kekahi mea i loko o ka dom e like me <div id="home"></div>.

.scrollspy('refresh')

Mālama ka scrollspy i nā pihi nav a me nā hoʻonohonoho ʻāpana no ka hana. Inā pono ʻoe e hoʻohou i kēia huna huna (inā paha he ʻike koʻikoʻi kāu) e kāhea wale i kēia ʻano hoʻomaha. Inā ʻoe i hoʻohana i ka ʻikepili ʻikepili e wehewehe i kāu scrollspy, e kāhea wale i ka refresh ma ke kino.

$ ( 'kino' ). scrollspy ( 'refresh' )

Demo

E nānā i ka hoʻokele ʻaoʻao ma luna o kēia ʻaoʻao.

Hoʻohui kēia plugin i ka wikiwiki, dynamic tab a me ka hana pila.

Hoʻoiho

Ke hoʻohana nei i ka boostrap-tabs.js

$ ( '.tabs' ). papa ()

Markup

Hiki iā ʻoe ke hoʻoikaika i ka ʻaoʻao a i ʻole ka hoʻokele pila me ka ʻole o ke kākau ʻana i kekahi javascript ma ka hāʻawi wale ʻana iā lākou i kahi ʻano data-tabsa i ʻole data-pills.

 <ul class = "tabs" data-tabs = "tabs" > ... </ul>   

Nā ʻano hana

$().tabs a i ʻole $().pills

Hoʻolaʻa i ka hana papa a me ka pila no kahi pahu i hāʻawi ʻia. Pono nā loulou tab e kuhikuhi i nā id ma ka palapala.

<ul class = "nā papa" > 
  <li class = "active" ><a href = "#home" > Home </a></li>  
  <li><a href = "#profile" > Profile </a></li> 
  <li><a href = "#messages" > Nā memo </a></li> 
  <li><a href = "#settings" > Nā hoʻonohonoho </a></li> 
</ul>
 
<div class = "pill-content" > 
  <div class = "active" id = "home" > ... </div>  
  <div id = "profile" > ... </div> 
  <div id = "nā memo" > ... </div> 
  <div id = "nā hoʻonohonoho" > ... </div> 
</ul>
 
<script>
  $ ( hana () {  
    $ ( '.tabs' ). papa ()
  })
</script>

Demo

• Home
• Pilikino
• Nā memo
• Nā hoʻonohonoho

Ma muli o ka plugin jQuery.tipsy maikaʻi loa i kākau ʻia e Jason Frame; ʻO twipsy kahi mana hou, ʻaʻole hilinaʻi i nā kiʻi, hoʻohana i ka css3 no nā animation, a me nā hiʻohiʻona ʻikepili no ka mālama inoa!

Hoʻoiho

Ke hoʻohana nei i ka bootstrap-twipsy.js

$ ( '#example' ). twipsy ( koho )

Nā koho

inoa	ʻano ʻano	paʻamau	wehewehe
hoʻolaula	boolean	ʻoiaʻiʻo	e hoʻopili i kahi hoʻololi css fade i ka mea hana
lohiMa	helu	0	lohi ma mua o ka hōʻike ʻana i ka ʻōlelo aʻoaʻo (ms)
hoʻopaneʻe	helu	0	lohi ma mua o ka hūnā ʻana i ka ʻōlelo aʻoaʻo (ms)
hāʻule hope	kaulahao	''	kikokiko e hoʻohana inā ʻaʻohe poʻo inoa mea hana
hoʻokomo	kaulahao	'luna'	pehea e hoʻonoho ai i ka mea hana - ma luna | malalo iho | waiho | akau
html	boolean	wahahee	hiki i ka html maʻiʻo i loko o ka mea hana
ola	boolean	wahahee	e hoʻohana i ka hāʻawi ʻana i ka hanana ma mua o nā mea hoʻokele hanana
offset	helu	0	ka hoʻopiʻi ʻana o ka pika o ka mea paahana mai ka mea i ʻimi ʻia
inoa	kaula | hana	'Poʻo inoa'	ʻano a i ʻole ke ʻano no ke kiʻi ʻana i ka kikokikona poʻo inoa
hoʻomaka	kaulahao	'hover'	pehea ka hoʻomaka ʻana o ka mea hana - hover | kālele | manual

Nā ʻano hana

$().twipsy(koho)

Hoʻopili i kahi mea hoʻohana twipsy i kahi hōʻiliʻili mea.

.twipsy('hōʻike')

Hōʻike i kahi mea twipsy.

$ ( '#element' ). twipsy ( 'hōʻike' )

.twipsy('huna')

Hūnā ʻia kahi mea twinpsy.

$ ( '#element' ). twipsy ( 'huna' )

.twipsy(ʻoiaʻiʻo)

Hoʻihoʻi mai i kahi laʻana o ka papa twipsy.

$ ( '#element' ). twipsy ( ʻoiaʻiʻo )

Hoʻomaopopo ʻO kahi ʻē aʻe, hiki ke kiʻi hou ʻia me $().data('twipsy').

Demo

Hāʻawi ka popover plugin i kahi maʻalahi no ka hoʻohui ʻana i nā popovers i kāu noi. Hoʻonui ia i ka plugin boostrap-twipsy.js , no laila e ʻoluʻolu e hopu i kēlā faila i ka wā e hoʻokomo ai i nā popovers i kāu papahana!

Hoʻoiho

Ke hoʻohana nei i boostrap-popover.js

$ ( '#example' ). popover ( koho )

Nā koho

inoa	ʻano ʻano	paʻamau	wehewehe
hoʻolaula	boolean	ʻoiaʻiʻo	e hoʻopili i kahi hoʻololi css fade i ka mea hana
lohiMa	helu	0	lohi ma mua o ka hōʻike ʻana i ka ʻōlelo aʻoaʻo (ms)
hoʻopaneʻe	helu	0	lohi ma mua o ka hūnā ʻana i ka ʻōlelo aʻoaʻo (ms)
hāʻule hope	kaulahao	''	kikokiko e hoʻohana inā ʻaʻohe poʻo inoa mea hana
hoʻokomo	kaulahao	'akau'	pehea e hoʻonoho ai i ka mea hana - ma luna | malalo iho | waiho | akau
html	boolean	wahahee	hiki i ka html maʻiʻo i loko o ka mea hana
ola	boolean	wahahee	e hoʻohana i ka hāʻawi ʻana i ka hanana ma mua o nā mea hoʻokele hanana
offset	helu	0	ka hoʻopiʻi ʻana o ka pika o ka mea paahana mai ka mea i ʻimi ʻia
inoa	kaula | hana	'Poʻo inoa'	ʻano a i ʻole ke ʻano no ke kiʻi ʻana i ka kikokikona poʻo inoa
maʻiʻo	kaula | hana	'ʻikepili-maʻiʻo'	ʻano a i ʻole ke ala no ka kiʻi ʻana i ke kikokikona maʻiʻo
hoʻomaka	kaulahao	'hover'	pehea ka hoʻomaka ʻana o ka mea hana - hover | kālele | manual

Nā ʻano hana

$().popover(koho)

Hoʻomaka i nā popovers no kahi hōʻiliʻili mea.

.popover('hōʻike')

Hōʻike i kahi mea popover.

$ ( '#element' ). popover ( 'hōʻike' )

.popover('huna')

Hūnā i ka popover element.

$ ( '#element' ). popover ( 'huna' )

Demo

lele no ka popover

ʻO ka plugin alert kahi papa liʻiliʻi loa no ka hoʻohui ʻana i nā hana kokoke i nā makaʻala.

Hoʻoiho

Ke hoʻohana nei i ka bootstrap-alerts.js

$ ( ".alert-message" ). makaʻala ()

Markup

Hoʻohui wale i kahi data-alerthiʻohiʻona i kāu mau leka makaʻala e hāʻawi ʻakomi iā lākou i ka hana kokoke.

Nā ʻano hana

$().alert()

Hoʻopili i nā mākaʻikaʻi āpau me ka hana kokoke. I mea e hoʻolalelale ai kāu mau makaʻala i ka wā i pani ʻia ai, e ʻike pono ua pili ka papa .fadea me .inka papa iā lākou.

.alert('kokoke')

Pani i kahi makaʻala.

$ ( ".alert-message" ). makaʻala ( 'close' )

Demo