मोडल दे बारे च

इक सुव्यवस्थित, पर लचीला, परंपरागत जावास्क्रिप्ट मोडल प्लगइन गी सिर्फ घट्ट शा घट्ट लोड़चदी कार्यक्षमता ते स्मार्ट डिफाल्ट कन्नै लैना।

स्थिर उदाहरण

नीचे इक स्थिर रेंडर कीता गेदा मोडल ऐ।

लाइव डेमो

निचले बटन पर क्लिक करियै जावास्क्रिप्ट दे राहें इक मोडल टॉगल करो। एह् थल्ले सरकग ते पृष्ठ दे शीर्शक थमां अंदर फीका होई जाग।

बूटस्ट्रैप-मोडल दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे जरिए मोडल गी कॉल करो:

$ ( '# मेरा मोडल' ) । मोडल ( विकल्प ) ऐ .

विकल्प ऐ

मार्कअप करना

तुस अपने पेज पर मोडल गी बिना कुसै जावास्क्रिप्ट दी इक लाइन लिखे दे आसानी कन्नै सक्रिय करी सकदे ओ। बस data-toggle="modal"इक नियंत्रक तत्व पर सेट करो इक data-target="#foo"जां href="#foo"जेह् ड़ा इक मोडल तत्व आईडी कन्नै मेल खंदा ऐ, ते क्लिक करने पर, एह् तुंदा मोडल लॉन्च करग.

एह्दे कन्नै गै, अपने मोडल इंस्टेंस च विकल्प जोड़ने आस्तै, बस उनेंगी नियंत्रण तत्व जां खुद मोडल मार्कअप पर अतिरिक्त डेटा विशेषताएं दे रूप च शामल करो.

<a class = "btn" data-toggle = "मोडल" href = "#myModal" > मोडल लॉन्च करो </a>    

<div वर्ग = "मोडल छिपाना" आईडी = "myModal" >  
  <div वर्ग = "मोडल-हेडर" > ऐ 
    <बटन प्रकार = "बटन" वर्ग = "बंद" डेटा-खारिज = "मोडल" > × </बटन>   
    <h3> मोडल हेडर </h3> ऐ
  </div> दा
  <div वर्ग = "मोडल-शरीर" > ऐ 
    <p> इक महीन शरीर... </p>
  </div> दा
  <div वर्ग = "मोडल-पाद लेख" > 
    <a href = "#" वर्ग = "बीटीएन" डेटा-खारिज = "मोडल" > बंद करो </a>   
    <a href = "#" class = "btn btn-primary" > बदलावें गी बचाओ </a>  
  </div> दा
</div> दा

विधियां

.मोडल(विकल्प) ऐ।

तुंदी सामग्री गी मोडल दे रूप च सक्रिय करदा ऐ। इक वैकल्पिक विकल्प स्वीकार करदा ऐ object.

$ ( '# मेरा मोडल' ) । मोडल ({ ऐ
  कीबोर्ड : झूठा 
}) ऐ।

.मोडल('टॉगल') ऐ।

मैन्युअल रूप कन्नै इक मोडल टॉगल करदा ऐ।

$ ( '# मेरा मोडल' ) । मोडल ( 'टॉगल' ) ऐ।

.मोडल('दिखाओ') ऐ।

मैन्युअल रूप कन्नै इक मोडल खोह् लदा ऐ।

$ ( '# मेरा मोडल' ) । मोडल ( 'दिखाओ' )

.मोडल('छुपाओ') ऐ।

मैन्युअल रूप कन्नै इक मोडल छिपांदा ऐ।

$ ( '# मेरा मोडल' ) । मोडल ( 'छुपाओ' )

घटनाएं

बूटस्ट्रैप दा मोडल वर्ग मोडल कार्यक्षमता च हुक करने आस्तै किश घटनाएं गी उजागर करदा ऐ।

$ ( '# मेरा मोडल' ) । पर ( 'छुपाया' , फंक्शन () {   
  // कुछ करो...
}) ऐ।

ड्रॉपडाउन दे बारे च

इस साधारण प्लगइन कन्नै बूटस्ट्रैप च लगभग कुसै बी चीज़ च ड्रॉपडाउन मेनू जोड़ो. बूटस्ट्रैप नवबार, टैब, ते गोलियां च पर पूर्ण ड्रॉपडाउन मेनू समर्थन दी सुविधा दिंदा ऐ।

उदाहरण दे

ड्रॉपडाउन दी जांच करने लेई हेठ दित्ते गेदे नवबार च ड्रॉपडाउन नेव लिंक ते गोलियां पर क्लिक करो।

• नियमित लिंक
• ड्रॉपडाउन
  • 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

बूटस्ट्रैप-ड्रॉपडाउन.जेएस दा उपयोग करदे होई

जावास्क्रिप्ट दे राहें ड्रॉपडाउन गी कॉल करो:

$ ( '.ड्रॉपडाउन-टॉगल' ) ऐ । ड्रॉपडाउन () ऐ।

मार्कअप करना

कुसै बी तत्व च ड्रॉपडाउन कार्यक्षमता गी जल्दी जोड़ने लेई बस जोड़ो data-toggle="dropdown"ते कोई बी वैध बूटस्ट्रैप ड्रॉपडाउन स्वतः सक्रिय होई जाग.

<ul class = "नव नव-गोलियाँ" > 
  <li class = "सक्रिय" ><a href = "#" > नियमित लिंक </a></li>  
  <ली वर्ग = "ड्रॉपडाउन" आईडी = "मेनू1" >  
    <a class = "ड्रॉपडाउन-टॉगल" डेटा-टॉगल = "ड्रॉपडाउन" href = "# मेनू1" >   
      ड्रॉपडाउन
      <b class = "कैरेट" </b> ऐ 
    </a> दा
    <ul वर्ग = "ड्रॉपडाउन-मेनू" > 
      <li><a href = "#" > कार्रवाई </a></li> 
      <li><a href = "#" > इक होर कार्रवाई </a></li> 
      <li><a href = "#" > इत्थें किश होर </a></li> 
      <li class = "विभाजक" </li> ऐ 
      <li><a href = "#" > अलग कीता गेदा कड़ी </a></li> 
    </ul> दा
  </li> दा
  ...
</ul> दा

data-targetURL गी बरकरार रखने आस्तै, href="#".

<ul class = "नव नव-गोलियाँ" > 
  <ली वर्ग = "ड्रॉपडाउन" > ऐ 
    <a class = "ड्रॉपडाउन-टॉगल" डेटा-टॉगल = "ड्रॉपडाउन" डेटा-लक्ष्य = "#" href = "पथ/टू/पेज.html" >    
      ड्रॉपडाउन
      <b class = "कैरेट" </b> ऐ 
    </a> दा
    <ul वर्ग = "ड्रॉपडाउन-मेनू" > 
      ...
    </ul> दा
  </li> दा
</ul> दा

विधियां

$ (). ड्रॉपडाउन () ऐ।

दित्ते गेदे नवबार जां टैब कीते गेदे नेविगेशन आस्तै मेनू गी सक्रिय करने आस्तै इक प्रोग्रामेटिक एपीआई।

स्क्रॉलस्पाई प्लगइन स्क्रॉल स्थिति दे आधार उप्पर नेव लक्ष्यें गी स्वतः अपडेट करने आस्तै ऐ।

स्क्रॉलस्पाई कन्नै उदाहरण नवबार

हेठ दित्ते गेदे इलाके गी स्क्रॉल करो ते नेविगेशन अपडेट दिक्खो। ड्रॉपडाउन उप आइटमें गी बी हाइलाइट कीता जाग। आज़माइश करो !

बूटस्ट्रैप-scrollspy.js दा उपयोग करदे होई

जावास्क्रिप्ट दे राहें स्क्रॉलस्पाई गी कॉल करो:

$ ( ' # नवबार' ) ऐ । स्क्रॉलस्पाई () ऐ।

मार्कअप करना

अपने टॉपबार नेविगेशन च स्क्रॉलस्पी व्यवहार गी आसानी कन्नै जोड़ने आस्तै, बस data-spy="scroll"उस तत्व च जोड़ो जिस पर तुस जासूसी करना चांह् दे ओ (सबने शा आम तौर पर एह् शरीर होग)।

<शरीर डेटा-जासूस = "स्क्रॉल" > ... </शरीर>  

विधियां

.scrollspy ('ताज़ा करो') ऐ।

DOM थमां तत्वें गी जोड़ने जां हटाने दे कन्नै-कन्नै scrollspy दा इस्तेमाल करदे बेल्लै तुसेंगी ताज़ा करने दी विधि गी इस चाल्ली बुलाने दी लोड़ होग:

$ ( '[डेटा-जासूस = "स्क्रॉल"]' ). हर इक ( फंक्शन () {  
  var $ जासूस = $ ( एह् ) । scrollspy ( 'ताज़ा करना' ) ऐ।
});

विकल्प ऐ

घटनाएं

एह् प्लगइन स् थानीय सामग्री दे राहें संक्रमण लेई त्वरित, गतिशील टैब ते गोली फ़ंक्शनलटी जोड़दा ऐ।

उदाहरण टैब

ड्रॉपडाउन मेनू दे राहें बी, छिपे दे फलकें दे बीच टॉगल करने लेई हेठ दित्ते गेदे टैबें पर क्लिक करो।

• घर
• प्रोफाइल
• ड्रॉपडाउन
  • @fat
  • @mdo

बूटस्ट्रैप-टैब.जेएस दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे राहें टैब करने योग्य टैबें गी सक्षम करो (हर टैब गी व्यक्तिगत रूप कन्नै सक्रिय करने दी लोड़ ऐ):

$ ( '# मेरा टैब ए' ). क्लिक करो ( फंक्शन ( ई ) {  
  ई . रोकनाडिफ़ॉल्ट ();
  $ ( एह् ) । टैब ( 'दिखाओ' );
}) ऐ।

तुस बक्ख-बक्ख टैबें गी केईं तरीके कन्नै सक्रिय करी सकदे ओ:

$ ( '# मेरा टैब ए [href="#प्रोफाइल"]' ). टैब ( 'दिखाओ' ); // नाम दे द्वारा टैब चुनें 
$ ( '# मेरा टैब ए: पैह्ला' ). टैब ( 'दिखाओ' ); // पैह्ला टैब चुनो 
$ ( '# मेरा टैब ए: आखरी' ). टैब ( 'दिखाओ' ); // आखरी टैब चुनें 
$ ( '# मेरा टैब ली: समीकरण (2) ए' ). टैब ( 'दिखाओ' ); // तीसरा टैब चुनें (0-अनुक्रमित) 

मार्कअप करना

तुस कुसै बी जावास्क्रिप्ट गी लिखने दे बगैर इक टैब जां गोली नेविगेशन गी सक्रिय करी सकदे ओ बस निर्दिश्ट करियै data-toggle="tab"जां data-toggle="pill"कुसै तत्व पर। navटैब च ते nav-tabsक्लासें गी जोड़ने कन्नै ulबूटस्ट्रैप टैब स्टाइलिंग लागू होग.

<ul class = "नव नव-टैब" > 
  <li><a href = "#घर" डेटा-टॉगल = "टैब" > घर </a></li>  
  <li><a href = "#प्रोफाइल" डेटा-टॉगल = "टैब" > प्रोफाइल </a></li>  
  <li><a href = "#संदेश" डेटा-टॉगल = "टैब" > संदेश </a></li>  
  <li><a href = "#सेटिंग्स" डेटा-टॉगल = "टैब" > सेटिंग्स </a></li>  
</ul> दा

विधियां

$ ().टैब दा

इक टैब तत्व ते सामग्री कंटेनर गी सक्रिय करदा ऐ। टैब च डीओएम च इक data-targetजां इक hrefकंटेनर नोड गी लक्ष्य बनाना चाहिदा ऐ.

<ul वर्ग = "नव नव-टैब" आईडी = "मेरा टैब" >  
  <li class = "सक्रिय" ><a href = "#घर" > घर </a></li>  
  <li><a href = "#प्रोफाइल" > प्रोफाइल </a></li> 
  <li><a href = "#संदेश" > संदेश </a></li> 
  <li><a href = "#सेटिंग्स" > सेटिंग्स </a></li> 
</ul> दा
 
<div वर्ग = "टैब-सामग्री" > 
  <div class = "टैब-पैन सक्रिय" आईडी = "घर" > ... </div>  
  <div class = "टैब-पैन" आईडी = "प्रोफाइल" > ... </div>  
  <div class = "टैब-पैन" आईडी = "संदेश" > ... </div>  
  <div वर्ग = "टैब-पैन" आईडी = "सेटिंग्स" > ... </div>  
</div> दा
 
<स्क्रिप्ट> दा
  $ ( फंक्शन () { ऐ।  
    $ ( '# मेरा टैब ए: आखरी' ). टैब ( 'दिखाओ' );
  }) ऐ।
</script> दा

घटनाएं

$ ( 'ए [डेटा-टॉगल = "टैब"]' ). पर ( 'दिखाया' , फंक्शन ( ई ) {   
  ई . लक्ष्य // सक्रिय टैब
  ई . relatedTarget // पिछले टैब
}) ऐ।

टूलटिप्स दे बारे च

जेसन फ्रेम द्वारा लिखे गेदे उत्कृष्ट jQuery.tipsy प्लगइन कन्नै प्रेरित; टूलटिप्स इक अपडेट कीता गेदा संस्करण ऐ , जेह् ड़ा छवियें पर निर्भर नेईं ऐ , एनीमेशन आस्तै css3 दा उपयोग करदा ऐ , ते स् थानीय शीर्शक भंडारण आस्तै डेटा-एट्रिब्यूट दा उपयोग करदा ऐ .

टूलटिप्स दा उदाहरण उपयोग

टूलटिप्स दिखने लेई निचले लिंक उप्पर होवर करो:

बूटस्ट्रैप-टूलटिप.जेएस दा उपयोग करदे होई

जावास्क्रिप्ट दे राहें टूलटिप गी ट्रिगर करो:

$ ( '# उदाहरण' ) ऐ । टूलटिप ( विकल्प ) ऐ .

विकल्प ऐ

मार्कअप करना

प्रदर्शन कारणें कन्नै, टूलटिप ते पोपोवर डेटा-एपीआईएस ऑप्ट इन न जेकर तुस उंदा इस्तेमाल करना चांह् दे ओ तां बस इक चयनकर्ता विकल्प निर्दिश्ट करो.

<a href = "#" rel = "टूलटिप" title = "पहला टूलटिप" > मेरे उप्पर मंडराओ </a>   

विधियां

$ ().टूलटिप (विकल्प) ऐ।

इक तत्व संग्रह कन्नै इक टूलटिप हैंडलर गी संलग्न करदा ऐ।

.टूलटिप ('दिखाओ') ऐ।

इक तत्व दी टूलटिप दा खुलासा करदा ऐ।

$ ( '# तत्व' ) ऐ । टूलटिप ( 'दिखाओ' )

.टूलटिप('छुपाओ') ऐ।

इक तत्व दी टूलटिप गी छुपांदा ऐ।

$ ( '# तत्व' ) ऐ । टूलटिप ( 'छुपाओ' )

.टूलटिप ('टॉगल') ऐ।

इक तत्व दी टूलटिप गी टॉगल करदा ऐ।

$ ( '# तत्व' ) ऐ । टूलटिप ( 'टॉगल' ) ऐ।

पोपोवर दे बारे च

हाउसिंग सेकेंडरी जानकारी आस्तै कुसै बी तत्व च सामग्री दे छोटे ओवरले गी जोड़ो, जि’यां आईपैड पर।

* टूलटिप गी शामल करने दी लोड़ ऐ

उदाहरण मंडरा पोपोवर

पोपोवर गी ट्रिगर करने लेई बटन उप्पर माउस करो।

बूटस्ट्रैप-पोपोवर.जेएस दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे राहें पोपोवर सक्षम करो:

$ ( '# उदाहरण' ) ऐ । पोपोवर ( विकल्प ) ऐ .

विकल्प ऐ

मार्कअप करना

प्रदर्शन कारणें कन्नै, टूलटिप ते पोपोवर डेटा-एपीआईएस ऑप्ट इन न जेकर तुस उंदा इस्तेमाल करना चांह् दे ओ तां बस इक चयनकर्ता विकल्प निर्दिश्ट करो.

विधियां

$ ().popover (विकल्प) ऐ।

इक तत्व संग्रह आस्तै पोपोवरें गी आरंभ करदा ऐ।

.popover('दिखाओ') ऐ।

इक तत्वों पोपोवर दा खुलासा करदा ऐ।

$ ( '# तत्व' ) ऐ । पोपोवर ( 'दिखाओ' )

.popover('छुपाओ') ऐ।

इक तत्व पोपोवर छुपांदा ऐ।

$ ( '# तत्व' ) ऐ । पोपोवर ( 'छुपाओ' ) ऐ।

.popover('टॉगल') ऐ।

इक तत्वों पॉपओवर टॉगल करदा ऐ।

$ ( '# तत्व' ) ऐ । पोपोवर ( 'टॉगल' ) ऐ।

अलर्ट दे बारे च

अलर्ट प्लगइन अलर्टें च नेड़में फ़ंक्शनलटी गी जोड़ने आस्तै इक निक्की क्लास ऐ।

उदाहरण दे अलर्ट

अलर्ट प्लगइन नियमित अलर्ट संदेशें पर कम्म करदा ऐ, ते संदेशें गी ब्लॉक करदा ऐ।

बूटस्ट्रैप-अलर्ट.जेएस दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे राहें इक अलर्ट गी खारिज करने गी सक्षम करो:

$ ( ".अलर्ट" ) ऐ। अलर्ट करना ()

मार्कअप करना

बस data-dismiss="alert"अपने बंद बटन च जोड़ो तां जे स्वचालित रूप कन्नै इक अलर्ट बंद कार्यक्षमता दित्ती जाई सकै।

<a class = "बंद करो" डेटा-खारिज = "अलर्ट" href = "#" > × </a> दा   

विधियां

$ (). अलर्ट () ऐ।

सारे अलर्टें गी नजदीकी कार्यक्षमता कन्नै लपेटदा ऐ। बंद होने पर अपने अलर्टें गी एनिमेट आउट करने लेई, सुनिश्चत करो जे उंदे कोल पैह् ले थमां गै .fadeते .inक्लास लागू ऐ।

.alert('बंद करो') ऐ।

इक अलर्ट बंद करदा ऐ।

$ ( ".अलर्ट" ) ऐ। अलर्ट ( 'बंद करो' )

घटनाएं

बूटस्ट्रैप दी अलर्ट क्लास अलर्ट फ़ंक्शनलटी च हुक करने आस्तै किश घटनाएं गी उजागर करदी ऐ।

$ ( '# मेरा-अलर्ट' ). बाइंड ( 'बंद' , फंक्शन () {   
  // कुछ करो...
}) ऐ।

तकरीबन

बटन दे नाल होर करो। नियंत्रण बटन राज्यें गी दस्सदा ऐ जां टूलबार जनेह् होर घटकें आस्तै बटनें दे समूह बनाओ.

उदाहरण दे इस्तेमाल करदे न

राज्यें ते टॉगल आस्तै बटन प्लगइन दा इस्तेमाल करो।

बूटस्ट्रैप-बटन.जेएस दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे राहें बटन सक्षम करो:

$ ( '.नव-टैब्स' ) ऐ। बटन दा ()

मार्कअप करना

डेटा विशेषताएं बटन प्लगइन दा अभिन्न अंग न। बक्ख-बक्ख मार्कअप किस्में लेई हेठ दित्ते गेदे उदाहरन कोड दी जांच करो।

<!-- इक बटन पर टॉगलिंग गी सक्रिय करने आस्तै data-toggle="बटन" जोड़ो -->
<बटन वर्ग = "बीटीएन" डेटा-टॉगल = "बटन" > इकल टॉगल </बटन>  
 
<!-- btn-group पर चेकबॉक्स शैली टॉगल करने आस्तै data-toggle="buttons-checkbox" जोड़ो -->
<div वर्ग = "बीटीएन-समूह" डेटा-टॉगल = "बटन-चेकबॉक्स" >  
  <बटन वर्ग = "बीटीएन" > बाएं </बटन> 
  <बटन वर्ग = "बीटीएन" > मध्य </बटन> 
  <बटन वर्ग = "बीटीएन" > दाएं </बटन> 
</div> दा
 
<!-- btn-group पर रेडियो शैली टॉगल करने आस्तै data-toggle="buttons-radio" जोड़ो -->
<div वर्ग = "बीटीएन-समूह" डेटा-टॉगल = "बटन-रेडियो" >  
  <बटन वर्ग = "बीटीएन" > बाएं </बटन> 
  <बटन वर्ग = "बीटीएन" > मध्य </बटन> 
  <बटन वर्ग = "बीटीएन" > दाएं </बटन> 
</div> दा

विधियां

$ (). बटन ('टॉगल') ऐ।

पुश स्टेट टॉगल करदा ऐ। बटन गी एह् दिक्खने गी दिंदा ऐ जे एह् सक्रिय होई गेदा ऐ।

<बटन वर्ग = "बीटीएन" डेटा-टॉगल = "बटन" > ... </बटन>   

$ (). बटन ('लोडिंग') ऐ।

बटन स्थिति गी लोड करने पर सेट करदा ऐ - बटन गी अक्षम करदा ऐ ते पाठ गी लोड करने च पाठ स्वैप करदा ऐ. डेटा विशेषता दा उपयोग करदे होई बटन तत्व पर पाठ लोड करने गी परिभाशत कीता जाना चाहिदा data-loading-text.

<button class = "btn" data-loading-text = "सामान लोड करना ..." > ... </बटन>   

$ (). बटन ('रीसेट') ऐ।

बटन स्थिति गी रीसेट करदा ऐ - पाठ गी मूल पाठ च स्वैप करदा ऐ।

$ (). बटन (स्ट्रिंग) ऐ।

बटन स्थिति गी रीसेट करदा ऐ - पाठ गी कुसै बी डेटा परिभाशत पाठ स्थिति च स्वैप करदा ऐ।

<बटन वर्ग = "बीटीएन" डेटा-पूरा-पाठ = "समाप्त!" > ... </बटन> दा   
<स्क्रिप्ट> दा
  $ ( '.बीटीएन' ) ऐ। बटन ( 'पूरा' ) ऐ।
</script> दा

तकरीबन

अकॉर्डियन ते नेविगेशन जनेह् संकुचित घटकें लेई आधार शैलियां ते लच��ला समर्थन हासल करो।

* संक्रमण प्लगइन गी शामल करने दी लोड़ ऐ।

उदाहरण दे तौर पर अकॉर्डियन

संकुचन प्लगइन दा इस्तेमाल करदे होई, असें इक साधारण अकॉर्डियन शैली विजेट बनाया:

बूटस्ट्रैप-collapse.js दा उपयोग करदे होई

जावास्क्रिप्ट दे राहें सक्षम करो:

$ ( ".संकुचित" ) ऐ। ढहना () ऐ।

विकल्प ऐ

मार्कअप करना

बस इक संकुचित तत्व दा नियंत्रण स्वतः असाइन करने आस्तै इक तत्व गी जोड़ो data-toggle="collapse"ते इक गी। एट्रिब्यूट इक css चयनकर्ता गी स्वीकार करदा ऐ जिस पर संकुचन लागू कीता जाई सकदा ऐ data-target. संकुचित तत्व data-targetच वर्ग गी ज़रूर जोड़ो । collapseजेकर तुस इसगी डिफाल्ट रूप कन्नै खुल्लना चांह् दे ओ तां अतिरिक्त वर्ग जोड़ो in.

<बटन वर्ग = "बीटीएन बीटीएन-खतरा" डेटा-टॉगल = "पतन" डेटा-लक्ष्य = "# डेमो" >   
  साधारण ढहने योग्य
</बटन> दा
 
<div id = "डेमो" वर्ग = "में ढहना" > ... </div>  

विधियां

.collapse(विकल्प) ऐ।

तुंदी सामग्री गी इक संकुचित तत्व दे रूप च सक्रिय करदा ऐ। इक वैकल्पिक विकल्प स्वीकार करदा ऐ object.

$ ( '# मेरा संकुचित करने योग्य' ). ढहना ({
  टॉगल करना : झूठा 
}) ऐ।

.collapse('टॉगल') ऐ।

इक संकुचित तत्व गी दस्से गेदे जां छिपाने आस्तै टॉगल करदा ऐ।

.collapse('दिखाओ') ऐ।

इक संकुचित तत्व दस्सदा ऐ।

.collapse('छुपाओ') ऐ।

इक संकुचित तत्व गी छुपांदा ऐ।

घटनाएं

बूटस्ट्रैप दा पतन वर्ग पतन कार्यक्षमता च हुक करने आस्तै किश घटनाएं गी उजागर करदा ऐ.

$ ( '# मेरा संकुचित करने योग्य' ). पर ( 'छुपाया' , फंक्शन () {   
  // कुछ करो...
}) ऐ।

तकरीबन

तत्वें दे माध्यम कन्नै साइकिलिंग आस्तै इक जेनेरिक प्लगइन। इक मस्ती दा।

उदाहरण हिंडोला

नीचे दी स्लाइड शो दिक्खो।

पैह्ला थंबनेल लेबल

क्रास जस्टो ओडियो, डैपिबस एसी फैसिलिस इन, एगेस्तास एगेट क्वाम। डोनेक आईडी एलिट नॉन मी पोर्टा ग्रेविडा एट एगेट मेटस। नुल्लम आईडी डोलोर आईडी निभ ultrices vehicula उत आईडी अभिजात वर्ग।

दूजा थंबनेल लेबल

क्रास जस्टो ओडियो, डैपिबस एसी फैसिलिस इन, एगेस्तास एगेट क्वाम। डोनेक आईडी एलिट नॉन मी पोर्टा ग्रेविडा एट एगेट मेटस। नुल्लम आईडी डोलोर आईडी निभ ultrices vehicula उत आईडी अभिजात वर्ग।

तीसरा थंबनेल लेबल

क्रास जस्टो ओडियो, डैपिबस एसी फैसिलिस इन, एगेस्तास एगेट क्वाम। डोनेक आईडी एलिट नॉन मी पोर्टा ग्रेविडा एट एगेट मेटस। नुल्लम आईडी डोलोर आईडी निभ ultrices vehicula उत आईडी अभिजात वर्ग।

‹ ऐ › ऐ

बूटस्ट्रैप-हिंडोला.जेएस दा इस्तेमाल करदे होई

जावास्क्रिप्ट दे जरिए कॉल करो:

$ ( '.हिंडोला' ) ऐ। हिंडोला () ऐ।

विकल्प ऐ

मार्कअप करना

पिछले ते अगले कन्रोल आस्तै डेटा विशेषताएं दा इस्तेमाल कीता जंदा ऐ। निचले उदाहरण मार्कअप दी जांच करो।

<div आईडी = "myCarousel" वर्ग = "हिंडोला स्लाइड" >  
  <!-- हिंडोला आइटम -->
  <div वर्ग = "हिंडोला-आंतरिक" > 
    <div वर्ग = "सक्रिय आइटम" > ... </div> 
    <div वर्ग = "आइटम" > ... </div> ऐ 
    <div वर्ग = "आइटम" > ... </div> ऐ 
  </div> दा
  <!-- हिंडोला नव -->
  <a class = "हिंडोला-नियंत्रण बाएं" href = "# myCarousel" डेटा-स्लाइड = "पिछला" > ‹ </a> दा   
  <a class = "हिंडोला-नियंत्रण सही" href = "# myCarousel" डेटा-स्लाइड = "अगला" > › </a> दा   
</div> दा

विधियां

.हिंडोला(विकल्प) ऐ।

इक वैकल्पिक विकल्पें कन्नै हिंडोला गी objectशुरू करदा ऐ ते आइटमें दे माध्यम कन्नै साइकिल चलाना शुरू करदा ऐ।

$ ( '.हिंडोला' ) ऐ। हिंडोला ({
  अंतराल : 2000 दा 
}) ऐ।

.हिंडोला('चक्र') ऐ।

हिंडोला आइटमें दे माध्यम कन्नै बाएं थमां दाएं चक्कर लांदा ऐ।

.हिंडोला('विराम') ऐ।

आइटम दे माध्यम कन्नै हिंडोला गी साइकिल चलाने थमां रोकदा ऐ।

.हिंडोला(नंबर) ऐ।

हिंडोला गी इक खास फ्रेम (0 आधारत, इक सरणी दे समान) च चक्र करदा ऐ।

.हिंडोला('पिछला')

पिछले आइटम गी चक्र करदा ऐ।

.हिंडोला('अगला') ऐ।

अगली आइटम तक चक्र।

घटनाएं

बूटस्ट्रैप दी हिंडोला वर्ग हिंडोला कार्यक्षमता च हुक करने आस्तै दो घटनाएं गी उजागर करदा ऐ।

तकरीबन

कुसै बी फार्म टेक्स्ट इनपुट कन्नै सुरुचिपूर्ण टाइपहेड्स गी जल्दी बनाने आस्तै इक बुनियादी, आसानी कन्नै विस्तारित प्लगइन।

मसाल

टाइप-हेड नतीजें गी दस्सने आस्तै निचले फील्ड च टाइप करना शुरू करो.

बूटस्ट्रैप-टाइपहेड.जेएस दा उपयोग करदे होई

जावास्क्रिप्ट दे राहें टाइपएहेड गी कॉल करो:

$ ( '.टाइपएहेड' ) ऐ । टाइपएहेड () ऐ।

विकल्प ऐ

मार्कअप करना

टाइप-हेड फ़ंक्शनलटी कन्नै इक तत्व गी रजिस्टर करने लेई डेटा विशेषताएं गी जोड़ो।

<इनपुट प्रकार = "पाठ" डेटा-प्रदान = "टाइपएहेड" >  

विधियां

.typeahead(विकल्प) ऐ।

इक टाइप-हेड कन्नै इक इनपुट गी आरंभ करदा ऐ।