ماڊلز جي باري ۾

هڪ منظم، پر لچڪدار، روايتي جاوا اسڪرپٽ ماڊل پلگ ان تي وٺي وٺو صرف گهٽ ۾ گهٽ گهربل ڪارڪردگي ۽ سمارٽ ڊفالٽ سان.

جامد مثال

هيٺ ڏنل هڪ مستحڪم طور تي پيش ڪيل ماڊل آهي.

لائيو ڊيمو

ھيٺ ڏنل بٽڻ تي ڪلڪ ڪندي جاوا اسڪرپٽ ذريعي ماڊل کي ٽوگل ڪريو. اھو ھيٺ لھي ويندو ۽ صفحي جي چوٽيءَ کان اندر ٿي ويندو.

بوٽ اسٽريپ ماڊل استعمال ڪندي

جاوا اسڪرپٽ ذريعي ماڊل کي ڪال ڪريو:

$ ( '#myModal' ). ماڊل ( اختيارن )

اختيارن

مارڪ اپ

توھان پنھنجي صفحي تي ماڊلز کي آساني سان چالو ڪري سگھو ٿا بغير جاوا اسڪرپٽ جي ھڪڙي لائن لکڻ جي. بس data-toggle="modal"هڪ ڪنٽرولر عنصر تي سيٽ ڪريو data-target="#foo"يا href="#foo"جيڪو هڪ ماڊل عنصر id سان ملندو آهي، ۽ جڏهن ڪلڪ ڪيو ويندو، اهو توهان جي ماڊل کي لانچ ڪندو.

انهي سان گڏ، توهان جي ماڊل مثال ۾ اختيارن کي شامل ڪرڻ لاء، صرف انهن کي شامل ڪريو اضافي ڊيٽا خاصيتن جي طور تي يا ته ڪنٽرول عنصر يا ماڊل مارڪ اپ پاڻ تي.

<a class = "btn" data-toggle = "modal" href = "#myModal" > لانچ موڊل </a>    

<div class = "modal hide " id = "myModal" >  
  <div class = "modal-header" > 
    <بٽن جو قسم = "بٽڻ" ڪلاس = "بند ڪريو" ڊيٽا-ڊسمس = "موڊل" > × </ بٽڻ>   
    <h3> ماڊل هيڊر </h3>
  </div>
  <div class = "modal-body" > 
    <p> ھڪڙو سٺو جسم… </p>
  </div>
  <div class = "modal-footer" > 
    <a href = "#" class = "btn" data-dismiss = "modal" > بند ڪريو </a>   
    <a href = "#" class = "btn btn-primary" > تبديليون محفوظ ڪريو </a>  
  </div>
</div>

طريقا

ماڊل (اختيارن)

توهان جي مواد کي ماڊل طور چالو ڪري ٿو. اختياري اختيارن کي قبول ڪري ٿو object.

$ ( '#myModal' ). ماڊل ({
  ڪي بورڊ : غلط 
})

.modal('ٽگل')

دستي طور تي ماڊل کي ٽوگل ڪري ٿو.

$ ( '#myModal' ). ماڊل ( 'ٽگل' )

ماڊل ('شو')

دستي طور تي هڪ ماڊل کوليو.

$ ( '#myModal' ). ماڊل ( 'شو' )

ماڊل ('لڪايو')

دستي طور تي هڪ ماڊل لڪائي ٿو.

$ ( '#myModal' ). ماڊل ( 'لڪ' )

واقعا

بوٽ اسٽريپ جو ماڊل ڪلاس ڪجھ واقعن کي ظاهر ڪري ٿو ماڊل ڪارڪردگي ۾ ڇڪڻ لاءِ.

$ ( '#myModal' ). تي ( 'لڪيل' ، فنڪشن () {   
  // ڪجھ ڪر…
})

ڊراپ ڊائون بابت

هن سادي پلگ ان سان بوٽ اسٽريپ ۾ تقريبن ڪنهن به شيءِ تي ڊراپ ڊائون مينيو شامل ڪريو. بوٽ اسٽريپ خصوصيت مڪمل ڊراپ ڊائون مينيو سپورٽ تي نيوبار، ٽيب، ۽ گوليون.

مثال

ڊراپ ڊائونز کي جانچڻ لاءِ نيوبار ۽ هيٺ ڏنل گولن ۾ ڊراپ ڊائون نيو لنڪس تي ڪلڪ ڪريو.

• باقاعده لنڪ
• ڊراپ ڊائون
  • Action
  • Another action
  • Something else here
  • Separated link
• ڊراپ ڊائون 2
  • Action
  • Another action
  • Something else here
  • Separated link
• ڊراپ ڊائون 3
  • Action
  • Another action
  • Something else here
  • Separated link

bootstrap-dropdown.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي ڊراپ ڊائونز کي ڪال ڪريو:

$ ( '. dropdown-toggle' ). ڊراپ ڊائون ()

مارڪ اپ

جلدي شامل ڪرڻ لاءِ ڊراپ ڊائون ڪارڪردگي ڪنهن به عنصر ۾ صرف شامل ڪريو data-toggle="dropdown"۽ ڪو به صحيح بوٽ اسٽريپ ڊراپ ڊائون خودڪار ٿي ويندو.

<ul class = "nav nav-pills" > 
  <li class = "active" ><a href = "#" > باقاعده لنڪ </a></li>  
  <li class = "dropdown " id = "menu1" >  
    <a class = "dropdown-toggle" data-toggle = "dropdown" href = "#menu1" >   
      ڊراپ ڊائون
      <b class = "caret" ></b> 
    </a>
    <ul class = "ڊراپ ڊائون مينيو" > 
      <li><a href = "#" > عمل </a></li> 
      <li><a href = "#" > ٻيو عمل </a></li> 
      <li><a href="#" > هتي ڪجھ ٻيو </a> </li> 
      <li class = "divider" ></li> 
      <li><a href="#" > الڳ ٿيل لنڪ </a> </li> 
    </ul>
  </li>
  ...
</ul>

URLs کي برقرار رکڻ لاءِ، data-targetصفت استعمال ڪريو بدران href="#".

<ul class = "nav nav-pills" > 
  <li class = "ڊراپ ڊائون" > 
    <a class = "dropdown-toggle" data-toggle = "dropdown" data-target = "#" href = "path/to/page.html" >    
      ڊراپ ڊائون
      <b class = "caret" ></b> 
    </a>
    <ul class = "ڊراپ ڊائون مينيو" > 
      ...
    </ul>
  </li>
</ul>

طريقا

$().ڊراپ ڊائون()

ڏنل نيوبار يا ٽيب ٿيل نيويگيشن لاءِ مينيو کي چالو ڪرڻ لاءِ پروگراماتي ايپ.

ScrollSpy پلگ ان اسڪرول پوزيشن جي بنياد تي نيوي هدفن کي خودڪار طور تي اپڊيٽ ڪرڻ لاءِ آهي.

مثال navbar scrollspy سان

ھيٺ ڏنل علائقي کي ڇڪيو ۽ نيويگيشن اپڊيٽ ڏسو. ڊراپ ڊائون ذيلي شيون پڻ نمايان ٿي وينديون. ڪوشش ڪريو!

bootstrap-scrollspy.js استعمال ڪندي

scrollspy کي جاوا اسڪرپٽ ذريعي ڪال ڪريو:

$ ( '#navbar' ). scrollspy ()

مارڪ اپ

آساني سان شامل ڪرڻ لاءِ scrollspy رويي کي توھان جي ٽاپبار نيويگيشن ۾، صرف اھو data-spy="scroll"عنصر شامل ڪريو جنھن تي توھان جاسوسي ڪرڻ چاھيو ٿا (اڪثر عام طور تي اھو جسم ھوندو).

<body data-spy = "اسڪرول" > ... </body>  

طريقا

.scrollspy('ريفريش')

جڏهن ڊوم مان عناصر کي شامل ڪرڻ يا ختم ڪرڻ سان گڏ scrollspy استعمال ڪندي، توهان کي ريفريش طريقي کي ڪال ڪرڻ جي ضرورت پوندي جيئن ته:

$ ( '[data-spy="scroll"]' ). هر ( فعل () {  
  var $spy = $ ( هي ). scrollspy ( 'ريفريش' )
})؛

اختيارن

واقعا

هي پلگ ان مقامي مواد ذريعي منتقلي لاءِ جلدي، متحرڪ ٽيب ۽ گولي جي ڪارڪردگي شامل ڪري ٿو.

مثال ٽيب

پوشیدہ پينز جي وچ ۾ ٽگل ڪرڻ لاءِ هيٺ ڏنل ٽيب تي ڪلڪ ڪريو، جيتوڻيڪ ڊراپ ڊائون مينيو ذريعي.

• گهر
• پروفائل
• ڊراپ ڊائون
  • @fat
  • @mdo

bootstrap-tab.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي ٽيبلبل ٽيب کي فعال ڪريو (هر ٽيب کي انفرادي طور تي چالو ڪرڻ جي ضرورت آهي):

$ ( '#myTab a' ). ڪلڪ ڪريو ( فنڪشن ( e ) {  
  اي . روڪڻ ڊفالٽ ()؛
  $ ( هي ). ٽيب ( 'شو' )؛
})

توھان ڪيترن ئي طريقن سان انفرادي ٽيب کي چالو ڪري سگھو ٿا:

$ ( '#myTab a[href="#profile"]' ). ٽيب ( 'شو' )؛ // نالي سان ٽيب چونڊيو 
$ ( '#myTab a:first' ). ٽيب ( 'شو' )؛ // پهريون ٽيب چونڊيو 
$ ( '#myTab a:last' ). ٽيب ( 'شو' )؛ // آخري ٽيب چونڊيو 
$ ( '#myTab li:eq(2) a' ). ٽيب ( 'شو' )؛ // ٽيون ٽيب چونڊيو (0-انڊيڪس ٿيل) 

مارڪ اپ

توھان چالو ڪري سگھو ٿا ٽيب يا گولي نيويگيشن بغير ڪنھن جاوا اسڪرپٽ لکڻ کان سواءِ صرف بيان ڪندي data-toggle="tab"يا data-toggle="pill"ھڪڙي عنصر تي. navٽيب ۾ ۽ nav-tabsڪلاس شامل ڪرڻ ulسان بوٽ اسٽريپ ٽيب اسٽائل لاڳو ٿيندو.

<ul class = "nav nav-tabs" > 
  <li><a href = "#home" data-toggle = "tab" > گھر </a></li>  
  <li><a href = "#profile" data-toggle = "tab" > پروفائل </a></li>  
  <li><a href = "#messages" data-toggle = "tab" > نياپا </a></li>  
  <li><a href = "#settings" data-toggle = "tab" > سيٽنگون </a></li>  
</ul>

طريقا

$().tab

هڪ ٽيب عنصر ۽ مواد ڪنٽينر کي چالو ڪري ٿو. ٽئب ۾ هجڻ گهرجي يا ته هڪ data-targetيا هڪ hrefٽارگيٽ ڪنٽينر نوڊ DOM ۾.

<ul class = "nav nav-tabs" id = "myTab" >  
  <li class = "active" ><a href = "#home" > گھر </a></li>  
  <li><a href = "#profile" > پروفائل </a></li> 
  <li><a href = "#messages" > نياپا </a></li> 
  <li><a href = "#settings" > سيٽنگون </a></li> 
</ul>
 
<div class = "tab-content" > 
  <div class = "tab-pane active" id = "home" > ... </div>  
  <div class = "tab-pane" id = "profile" > ... </div>  
  <div class = "tab-pane" id = "messages" > ... </div>  
  <div class = "tab-pane" id = "settings" > ... </div>  
</div>
 
<script>
  $ ( فنڪشن () {  
    $ ( '#myTab a:last' ). ٽيب ( 'شو' )؛
  })
</script>

واقعا

$ ( 'a[data-toggle="tab"]' ). تي ( 'ڏسو' ، فنڪشن ( اي ) {   
  اي . ٽارگيٽ // چالو ٿيل ٽيب
  اي . لاڳاپيل ٽارگيٽ // پوئين ٽيب
})

Tooltips بابت

جيسن فريم پاران لکيل شاندار jQuery.tipsy پلگ ان کان متاثر ٿي؛ ٽول ٽائپس هڪ اپڊيٽ ورجن آهن، جيڪي تصويرن تي ڀروسو نٿا ڪن، اينيميشنز لاءِ css3 استعمال ڪن ٿا، ۽ مقامي ٽائيٽل اسٽوريج لاءِ ڊيٽا-انتظامات.

اوزار ٽائپس جو مثال استعمال ڪريو

ٽول ٽائپس ڏسڻ لاءِ هيٺ ڏنل لنڪ تي هور ڪريو:

bootstrap-tooltip.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي ٽول ٽائپ کي ڇڪيو:

$ ( '#مثال' ). ٽول ٽپ ( اختيارن )

اختيارن

مارڪ اپ

ڪارڪردگي جي سببن لاء، ٽول ٽائپ ۽ پاپ اوور ڊيٽا-ايپس آپٽ ان آهن. جيڪڏهن توهان انهن کي استعمال ڪرڻ چاهيو ٿا ته صرف هڪ چونڊيندڙ اختيار بيان ڪريو.

<a href = "#" rel = "tooltip" title = "first tooltip" > منهنجي مٿان هوور ڪريو </a>   

طريقا

$().ٽول ٽپ (اختيارن)

هڪ ٽول ٽائپ هينڊلر کي هڪ عنصر گڏ ڪرڻ سان ڳنڍي ٿو.

ٽول ٽپ ('شو')

هڪ عنصر جي ٽول ٽائپ کي ظاهر ڪري ٿو.

$ ( '# عنصر' ). ٽول ٽائپ ( 'ڏسو' )

ٽول ٽپ ('لڪايو')

هڪ عنصر جي ٽول ٽائپ کي لڪائيندو آهي.

$ ( '# عنصر' ). ٽول ٽپ ( 'لڪايو' )

ٽول ٽپ ('ٽگل')

هڪ عنصر جي ٽول ٽائپ کي ٽوگل ڪري ٿو.

$ ( '# عنصر' ). ٽول ٽپ ( 'ٽگل' )

پوپ جي باري ۾

مواد جا ننڍا اوورليز شامل ڪريو، جهڙوڪ iPad تي، ھاؤسنگ ثانوي معلومات لاءِ ڪنھن به عنصر ۾.

* ٽول ٽائپ کي شامل ڪرڻ جي ضرورت آهي

مثال hover popover

پاپ اوور کي ٽوڙڻ لاءِ بٽڻ تي هور ڪريو.

bootstrap-popover.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي پاپ اوور کي فعال ڪريو:

$ ( '#مثال' ). پاپ اوور ( اختيارن )

اختيارن

مارڪ اپ

ڪارڪردگي جي سببن لاء، ٽول ٽائپ ۽ پاپ اوور ڊيٽا-ايپس آپٽ ان آهن. جيڪڏهن توهان انهن کي استعمال ڪرڻ چاهيو ٿا ته صرف هڪ چونڊيندڙ اختيار بيان ڪريو.

طريقا

$().popover(اختيارن)

هڪ عنصر گڏ ڪرڻ لاء popovers جي شروعات.

.popover ('شو')

ظاهر ڪري ٿو هڪ عنصر پاپ اوور.

$ ( '# عنصر' ). پاپ اوور ( 'شو' )

.popover ('لڪايو')

هڪ عنصر پاپ اوور کي لڪائيندو آهي.

$ ( '# عنصر' ). پوپ اوور ( 'لڪ' )

.popover ('ٽگل')

هڪ عناصر پاپ اوور کي ٽوگل ڪري ٿو.

$ ( '# عنصر' ). پاپ اوور ( 'ٽگل' )

خبرداري بابت

الرٽ پلگ ان هڪ ننڍڙو طبقو آهي جيڪو الرٽ کي ويجهي ڪارڪردگي شامل ڪرڻ لاء.

مثال جي خبرداري

الرٽ پلگ ان باقاعده خبرداري پيغامن تي ڪم ڪري ٿو، ۽ پيغامن کي بلاڪ ڪريو.

bootstrap-alert.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي خبرداري جي برطرفي کي فعال ڪريو:

$ ( ". الرٽ" ). خبردار ()

مارڪ اپ

بس data-dismiss="alert"پنهنجي بند بٽڻ ۾ شامل ڪريو خودڪار طور تي الرٽ بند ڪارڪردگي ڏي.

<a class = "close" data- dismiss = "alert" href = "#" > × </a>   

طريقا

$(). الرٽ()

ويجھي ڪارڪردگي سان سڀني خبردارين کي لپي ٿو. بند ٿيڻ تي توهان جي خبردارين کي متحرڪ ڪرڻ لاءِ، پڪ ڪريو ته انهن وٽ .fade۽ .inڪلاس اڳ ۾ ئي انهن تي لاڳو آهي.

خبردار ('بند')

هڪ خبرداري بند ڪري ٿو.

$ ( ". الرٽ" ). خبردار ( 'بند' )

واقعا

بوٽ اسٽريپ جي الرٽ ڪلاس ڪجھ واقعن کي بي نقاب ڪري ٿو خبرداري جي ڪارڪردگي ۾ ڇڪڻ لاءِ.

$ ( '#my-alert' ). پابند ( 'بند' ، فنڪشن () {   
  // ڪجھ ڪر…
})

بابت

بٽڻ سان وڌيڪ ڪريو. ڪنٽرول بٽڻ بيان ڪري ٿو يا ٽول بار وانگر وڌيڪ اجزاء لاءِ بٽڻن جا گروپ ٺاھيو.

مثال استعمال

رياستن ۽ ٽوگلز لاءِ بٽڻ پلگ ان استعمال ڪريو.

bootstrap-button.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي بٽڻ کي فعال ڪريو:

$ ( '.nav-tabs' ). بٽڻ ()

مارڪ اپ

ڊيٽا خاصيتون بٽڻ پلگ ان لاء لازمي آهن. مختلف مارڪ اپ جي قسمن لاءِ هيٺ ڏنل مثال ڪوڊ چيڪ ڪريو.

<!-- شامل ڪريو data-toggle="button" هڪ بٽڻ تي ٽوگلنگ کي چالو ڪرڻ لاءِ -->
<button class = "btn" data-toggle = "buton " > Single Toggle </button>  
 
<!-- btn-group تي چيڪ باڪس انداز ٽوگلنگ لاءِ data-toggle="buttons-checkbox" شامل ڪريو -->
<div class = "btn-group" data-toggle = "buttons-checkbox" >  
  <button class = "btn" > کاٻي </ بٽڻ> 
  < بٽن ڪلاس = "btn" > وچين </ بٽڻ> 
  <button class = "btn" > ساڄي </ بٽڻ> 
</div>
 
<!-- btn-group تي ريڊيو اسٽائل ٽوگلنگ لاءِ data-toggle="buttons-radio" شامل ڪريو -->
<div class = "btn-group" data-toggle = "buttons-radio" >  
  <button class = "btn" > کاٻي </ بٽڻ> 
  < بٽن ڪلاس = "btn" > وچين </ بٽڻ> 
  <button class = "btn" > ساڄي </ بٽڻ> 
</div>

طريقا

$().بٽن('ٽگل')

ٽوگلز پش اسٽيٽ. بٽڻ کي ظاهر ڪري ٿو ته اهو چالو ڪيو ويو آهي.

<button class = "btn" data-toggle = "buton " > … </buton>   

$().بٽن('لوڊنگ')

بٽڻ جي حالت کي لوڊ ڪرڻ لاء سيٽ ڪري ٿو - بٽڻ کي غير فعال ڪري ٿو ۽ متن کي لوڊ ڪرڻ لاء متن کي تبديل ڪري ٿو. لوڊ ڪندي متن کي بيان ڪيو وڃي بٽڻ واري عنصر تي ڊيٽا خاصيت استعمال ڪندي data-loading-text.

<button class = "btn" data-loading-text = "لوڊنگ سامان..." > ... </ بٽڻ>   

$().بٽن('ري سيٽ')

بٽڻ واري حالت کي ري سيٽ ڪري ٿو - متن کي اصل متن ۾ تبديل ڪري ٿو.

$().بٽن(اسٽرنگ)

بٽڻ واري حالت کي ري سيٽ ڪري ٿو - متن کي ڪنهن به ڊيٽا جي وضاحت ڪيل ٽيڪسٽ اسٽيٽ ڏانهن تبديل ڪري ٿو.

<button class = "btn" data-complete-text = "ختم!" > ... </ بٽڻ>   
<script>
  $ ( '.btn' ). بٽڻ ( 'مڪمل' )
</script>

بابت

بنيادي اسلوب ۽ لچڪدار سپورٽ حاصل ڪريو ٽوڙڻ واري اجزاء لاءِ جيئن accordions ۽ نيويگيشن.

* ٽرانزيڪشن پلگ ان کي شامل ڪرڻ جي ضرورت آهي.

مثال accordion

کولپس پلگ ان کي استعمال ڪندي، اسان هڪ سادي accordion اسٽائل ويجيٽ ٺاهيو آهي:

bootstrap-collapse.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي فعال ڪريو:

$ ( ". ٽوڙيو" ). ٽٽڻ ()

اختيارن

مارڪ اپ

بس شامل ڪريو data-toggle="collapse"۽ هڪ data-targetعنصر کي خودڪار طور تي ختم ڪرڻ واري عنصر جي ڪنٽرول کي تفويض ڪرڻ لاء. انتساب قبول ڪري ٿو هڪ سي data-targetايس ايس چونڊيندڙ کي لاڳو ڪرڻ لاءِ. پڪ ڪريو ته ڪلاس collapseکي ٽوڙڻ واري عنصر ۾ شامل ڪريو. جيڪڏھن توھان چاھيو ٿا ته ان کي ڊفالٽ کوليو وڃي، اضافي ڪلاس شامل ڪريو in.

< بٽن ڪلاس = " btn btn-danger" data - toggle = "colapse " data-target = "#demo" >   
  سادو ٽوڙڻ وارو
</ بٽڻ>
 
<div id = "demo" class = "colapse in" > … </div>  

طريقا

کولڻ (اختيارن)

توهان جي مواد کي کولڻ واري عنصر جي طور تي چالو ڪري ٿو. اختياري اختيارن کي قبول ڪري ٿو object.

$ ( '#myCollapsible' ). ٽوڙڻ ({
  ٽوگل : ڪوڙو 
})

کولڻ ('ٽگل')

ڏيکاريل يا لڪائڻ لاءِ کولڻ لائق عنصر کي ٽوگل ڪري ٿو.

.collapse('ڏسو')

هڪ ٽوڙڻ وارو عنصر ڏيکاري ٿو.

کولڻ ('لڪايو')

هڪ ٽوڙڻ واري عنصر کي لڪائيندو آهي.

واقعا

بوٽ اسٽريپ جي تباهي واري طبقي کي ختم ڪرڻ جي ڪارڪردگي ۾ ڇڪڻ لاء ڪجھ واقعن کي ظاهر ڪري ٿو.

$ ( '#myCollapsible' ). تي ( 'لڪيل' ، فنڪشن () {   
  // ڪجھ ڪر…
})

بابت

عناصر ذريعي سائيڪل هلائڻ لاءِ هڪ عام پلگ ان. هڪ خوشيءَ وارو دور.

مثال ڪارسيل

هيٺ ڏنل سلائڊ شو ڏسو.

پهريون ٿامبنيل ليبل

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.

ٻيو ٿمبنيل ليبل

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.

ٽيون ٿامبنيل ليبل

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.

‹ ›

bootstrap-carousel.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي ڪال ڪريو:

$ ( '.carousel' ). ڪاروائيل ()

اختيارن

مارڪ اپ

ڊيٽا جون خاصيتون پوئين ۽ ايندڙ ڪنٽرولز لاءِ استعمال ٿين ٿيون. هيٺ ڏنل مثال مارڪ اپ چيڪ ڪريو.

<div id = "myCarousel" class = "carousel slide" >  
  <!-- Carousel شيون -->
  <div class = "carousel-inner" > 
    <div class = "active item" > … </div> 
    <div class = "item" > … </div> 
    <div class = "item" > … </div> 
  </div>
  <!-- Carousel nav -->
  <a class = "carousel-control left" href = "#myCarousel" data-slide = "prev" > ‹ </a>   
  <a class = "carousel-control right" href = "#myCarousel" data-slide = "next" > › </a>   
</div>

طريقا

.carousel(اختيارن)

ڪارسيل کي اختياري اختيارن سان objectشروع ڪري ٿو ۽ شيون ذريعي سائيڪل کي شروع ڪري ٿو.

$ ( '.carousel' ). ڪاروسل ({
  وقفو : 2000 
})

.carousel('سائيڪل')

کاٻي کان ساڄي تائين ڪارسيل شيون ذريعي سائيڪل.

.carousel('pause')

ڪارسيل کي شيون ذريعي سائيڪل هلائڻ کان روڪي ٿو.

.carousel (نمبر)

ڪارسيل کي ھڪڙي خاص فريم ڏانھن (0 تي ٻڌل، ھڪڙي صف سان ملندڙ جلندڙ).

.carousel('اڳوڻي')

پوئين شيءِ ڏانهن چڪر.

.carousel('اڳيون')

ايندڙ شيون ڏانهن سائيڪل.

واقعا

بوٽ اسٽريپ جي ڪارسيل ڪلاس ٻن واقعن کي ظاهر ڪري ٿو ڪارسيل ڪارڪردگي ۾ ڇڪڻ لاءِ.

بابت

هڪ بنيادي، آساني سان وڌايل پلگ ان ڪنهن به فارم جي ٽيڪسٽ ان پٽ سان جلدي خوبصورت ٽائپ هيڊس ٺاهڻ لاءِ.

مثال

ٽائيپ هيڊ نتيجا ڏيکارڻ لاءِ ھيٺ ڏنل فيلڊ ۾ ٽائپنگ شروع ڪريو.

bootstrap-typeahead.js استعمال ڪندي

جاوا اسڪرپٽ ذريعي ٽائيپ هيڊ کي ڪال ڪريو:

$ ( '.typeahead' ). ٽائيپ هيڊ ()

اختيارن

مارڪ اپ

ٽائيپ هيڊ ڪارڪردگي سان هڪ عنصر کي رجسٽر ڪرڻ لاء ڊيٽا خاصيتون شامل ڪريو.

<انپٽ جو قسم = "ٽيڪسٽ" ڊيٽا مهيا ڪريو = "ٽائيپ هيڊ" >  

طريقا

.typeahead (اختيارن)

ٽائيپ هيڊ سان هڪ ان پٽ کي شروع ڪري ٿو.