मुख्य सामग्री पर जाओ डॉक्स नेविगेशन पर जाओ
in English

टूलटिप्स दा

एनीमेशनें लेई CSS3 दा उपयोग करदे होई CSS ते जावास्क्रिप्ट कन्नै कस्टम बूटस्ट्रैप टूलटिप्स जोड़ने आस्तै दस्तावेजीकरण ते उदाहरण ते लोकल टाइटल भंडारण आस्तै डेटा-बीएस-एट्रिब्यूट।

अवलोकन करना

टूलटिप प्लगइन दा इस्तेमाल करदे बेल्लै जानने आह्लियां गल्लां:

  • टूलटिप्स पोजीशनिंग लेई 3rd पार्टी लाइब्रेरी पॉपर पर निर्भर करदे न । टूलटिप्स गी कम्म करने आस्तै तुसेंगी bootstrap.js थमां पैह् ले popper.min.js गी शामल करना होग जां bootstrap.bundle.min.js/ दा इस्तेमाल करना होग bootstrap.bundle.jsजेह् ड़ा Popper गी शामल करदा ऐ !
  • टूलटिप्स प्रदर्शन कारणें कन्नै ऑप्ट-इन न , इसलेई तुसेंगी अपने आपै गी उनेंगी शुरू करना होग .
  • शून्य-लंबाई आह् ले शीर्शक आह् ले टूलटिप कदें बी प्रदर्शत नेईं कीते जंदे न.
  • होर जटिल घटकें च रेंडरिंग समस्याएं थमां बचने आस्तै निर्दिश्ट करो container: 'body'(जियां साढ़े इनपुट समूह, बटन समूह बगैरा)।
  • छिपे दे तत्वें पर टूलटिप्स गी ट्रिगर करना कम्म नेईं करग.
  • .disabledया तत्वें लेई टूलटिप्स disabledगी इक रैपर तत्व पर ट्रिगर ���ीता जाना लोड़चदा ऐ।
  • जदूं हाइपरलिंक थमां ट्रिगर कीता जंदा ऐ जेह् ड़े मते सारे लाइनें च फैले दे न, तां टूलटिप्स केंद्रत होङन। इस बर्ताव कोला बचने लेई white-space: nowrap;अपने एस पर इस्तेमाल करो ।<a>
  • टूलटिप्स गी उंदे सरबंधत तत्वें गी डीओएम थमां हटाने थमां पैह् ले छिपाना लोड़चदा ऐ.
  • टूलटिप्स गी इक शैडो डीओएम दे अंदर इक तत्व दी बदौलत ट्रिगर कीता जाई सकदा ऐ।
डिफ़ॉल्ट रूप कन्नै, एह् घटक बिल्ट-इन सामग्री सैनिटाइजर दा उपयोग करदा ऐ, जेह् ड़ा कुसै बी HTML तत्वें गी स्ट्रिप करदा ऐ जेह् ड़े स्पश्ट रूप कन्नै मंजूर नेईं न। होर मती जानकारी आस्तै साढ़े जावास्क्रिप्ट दस्तावेजें च सेनेटाइजर खंड दिक्खो ।
इस घटक दा एनीमेशन प्रभाव prefers-reduced-motionमीडिया क्वेरी पर निर्भर करदा ऐ। साढ़े सुलभता दस्तावेजें दा घट्ट कीती गेदी गति खंड दिक्खो .

ओह सब मिल गया? शानदार, आओ दिक्खने आं जे ओह् किश उदाहरणें कन्नै किस चाल्ली कम्म करदे न।

उदाहरण: हर थाह् र टूलटिप्स सक्षम करो

इक पृष्ठ पर सारे टूलटिप्स गी शुरू करने दा इक तरीका एह् होग जे उ’नेंगी उंदी data-bs-toggleविशेषता कन्नै चुनना ऐ :

var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
  return new bootstrap.Tooltip(tooltipTriggerEl)
})

उदाहरण दे

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

टूलटिप्स कन्नै किश इनलाइन लिंक गी प्रदर्शत करने आस्तै प्लेसहोल्डर पाठ । एह् हून सिर्फ फिलर ऐ, कोई किलर नेईं। इत्थें सिर्फ असली पाठ दी मौजूदगी दी नकल करने आस्तै रक्खी गेदी सामग्री . ते एह् सब किश सिर्फ तुसेंगी इक विचार देने आस्तै जे असल दुनिया दी परिस्थितियें च इस्तेमाल होने पर टूलटिप्स किस चाल्ली दिक्खग। तो उम्मीद ऐ जे तुसें हून दिक्खेआ ऐ जे लिंक पर एह् टूलटिप्स किस चाल्ली व्यवहार च कम्म करी सकदे न, इक बारी जेकर तुस उंदा इस्तेमाल अपनी साइट जां प्रोजेक्ट पर करी लैंदे ओ।

चार टूलटिप्स दिशा-निर्देशें गी दिक्खने लेई हेठ दित्ते गेदे बटनें उप्पर माउस करो: उप्पर, दाएं, थल्लै, ते बाएं। आरटीएल च बूटस्ट्रैप दा इस्तेमाल करदे बेल्लै दिशा-निर्देशें गी मिरर कीता जंदा ऐ।

<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">
  Tooltip on top
</button>
<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="right" title="Tooltip on right">
  Tooltip on right
</button>
<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tooltip on bottom">
  Tooltip on bottom
</button>
<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="left" title="Tooltip on left">
  Tooltip on left
</button>

ते कस्टम एचटीएमएल जोड़े गेदे कन्नै:

<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-html="true" title="<em>Tooltip</em> <u>with</u> <b>HTML</b>">
  Tooltip with HTML
</button>

इक एसवीजी कन्नै:

सस्स

चर करने वाले

$tooltip-font-size:                 $font-size-sm;
$tooltip-max-width:                 200px;
$tooltip-color:                     $white;
$tooltip-bg:                        $black;
$tooltip-border-radius:             $border-radius;
$tooltip-opacity:                   .9;
$tooltip-padding-y:                 $spacer * .25;
$tooltip-padding-x:                 $spacer * .5;
$tooltip-margin:                    0;

$tooltip-arrow-width:               .8rem;
$tooltip-arrow-height:              .4rem;
$tooltip-arrow-color:               $tooltip-bg;

प्रयोग करना

टूलटिप प्लगइन मंग पर सामग्री ते मार्कअप पैदा करदा ऐ, ते डिफाल्ट रूप कन्नै टूलटिप गी उंदे ट्रिगर तत्व दे बाद रक्खदा ऐ।

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

var exampleEl = document.getElementById('example')
var tooltip = new bootstrap.Tooltip(exampleEl, options)
ओवरफ्लो autoऔरscroll

टूलटिप स्थिति उस बेल्लै स्वतः बदलने दी कोशश करदी ऐ जिसलै कुसै पैतृक कंटेनर च साढ़ा ऐ overflow: autoजां पसंद ऐ , पर फ्ही बी मूल प्लेसमेंट दी स्थिति गी रक्खदा ऐ. इसगी हल करने आस्तै, विकल्प (विकल्प दा इस्तेमाल करदे होई फ्लिप संशोधक आस्तै ) गी डिफाल्ट मान गी ओवरराइड करने आस्तै कुसै बी HTMLElement पर सेट करो, , जि'यां :overflow: scroll.table-responsiveboundarypopperConfig'clippingParents'document.body

var exampleEl = document.getElementById('example')
var tooltip = new bootstrap.Tooltip(exampleEl, {
  boundary: document.body // or document.querySelector('#boundary')
})

मार्कअप करना

टूलटिप आस्तै लोड़चदा मार्कअप सिर्फ इक dataविशेषता ऐ ते titleHTML तत्व पर तुस इक टूलटिप होना चांह् दे ओ. टूलटिप दा जनरेट कीता गेदा मार्कअप बल्के सरल ऐ, हालांकि इसगी इक स्थिति दी लोड़ ऐ (डिफ़ॉल्ट रूप कन्नै, topप्लगइन आसेआ सेट कीता गेदा ऐ)।

कीबोर्ड ते सहायक तकनीक दे बरतूनी आस्तै टूलटिप्स गी कम्म करने आस्तै बनाना

तुसें गी सिर्फ HTML तत्वें च टूलटिप्स जोड़ना चाहिदा जेह् ड़े परंपरागत रूप कन्नै कीबोर्ड-केंद्रित ते इंटरएक्टिव होंदे न (जिऱयां लिंक जां फार्म नियंत्रण)। हालांकि मनमाने आह् ले HTML तत्वें (जिऱयां <span>s) गी विशेषता गी जोड़ियै फोकस करने योग्य बनाया जाई सकदा ऐ tabindex="0", एह् कीबोर्ड बरतूनी आस्तै गैर-इंटरएक्टिव तत्वें पर संभावित परेशान करने आह् ले ते भ्रमित करने आह् ले टैब स्टॉप जोड़ग , ते इस स्थिति च मते सारे सहायक तकनीकें इसलै टूलटिप दी घोशणा नेईं करदियां न इसदे अलावा, अपने टूलटिप आस्तै ट्रिगर दे रूप च सिर्फ इस पर भरोसा नेईं hoverकरो, की जे इस कन्नै कीबोर्ड बरतूनी आस्तै तुंदे टूलटिप गी ट्रिगर करना असंभव होई जाग.

<!-- HTML to write -->
<a href="#" data-bs-toggle="tooltip" title="Some tooltip text!">Hover over me</a>

<!-- Generated markup by the plugin -->
<div class="tooltip bs-tooltip-top" role="tooltip">
  <div class="tooltip-arrow"></div>
  <div class="tooltip-inner">
    Some tooltip text!
  </div>
</div>

अक्षम तत्व

विशेषता आह् ले तत्व disabledइंटरएक्टिव नेईं न, मतलब बरतूनी कुसै टूलटिप (जां पॉपओवर) गी ट्रिगर करने आस्तै उ’नेंगी फोकस, होवर, जां क्लिक नेईं करी सकदे न. इक समाधान दे तौर पर, तुस इक रैपर थमां टूलटिप गी ट्रिगर करना चांह् दे ओ <div>जां <span>, आदर्श रूप कन्नै कीबोर्ड-फोकस करने योग्य बनाया गेदा ऐ tabindex="0".

<span class="d-inline-block" tabindex="0" data-bs-toggle="tooltip" title="Disabled tooltip">
  <button class="btn btn-primary" type="button" disabled>Disabled button</button>
</span>

विकल्प ऐ

विकल्पें गी डेटा एट्रिब्यूट जां जावास्क्रिप्ट दे राहें पास कीता जाई सकदा ऐ। डेटा विशेषताएं आस्तै, विकल्प नांऽ गी data-bs-, च जोड़ो , जिऱयां data-bs-animation="". डेटा विशेषताएं दे राहें विकल्पें गी पास करदे बेल्लै विकल्प नांऽ दा केस प्रकार camelCase थमां कबाब-केस च बदलना सुनिश्चत करो. मसलन, , दा इस्तेमाल करने दे बजाय data-bs-customClass="beautifier", दा इस्तेमाल करो data-bs-custom-class="beautifier".

ध्यान रक्खो जे सुरक्षा कारणें करी sanitize, sanitizeFn, ते allowListविकल्पें गी डेटा विशेषताएं दा इस्तेमाल करियै सप्लाई नेईं कीता जाई सकदा ऐ.
नां किसम डिफाल्ट ब्यौरा
animation बूलियन true टूलटिप पर इक सीएसएस फीड संक्रमण लागू करो
container तार | तत्व | गलत false

टूलटिप गी इक विशिष्ट तत्व कन्नै जोड़दा ऐ। उदाहरण : container: 'body'ऐ . एह् विकल्प इस चाल्लीं खास तौर उप्पर उपयोगी ऐ जे एह् तुसेंगी ट्रिगर करने आह् ले तत्व दे कोल दस्तावेज दे प्रवाह च टूलटिप गी तैह् त करने दी इजाजत दिंदा ऐ - जेह् ड़ा इक विंडो आकार बदलने दौरान टूलटिप गी ट्रिगर करने आह् ले तत्व थमां दूर तैह् त होने थमां रोकग.

delay नंबर | चीज 0

टूलटिप (ms) गी दस्सने ते छिपाने च देरी - मैन्युअल ट्रिगर प्रकार पर लागू नेईं होंदा ऐ

जेकर कोई नंबर सप्लाई कीता जंदा ऐ तां छुपा/दिक्खो दोनें पर देरी लागू कीती जंदी ऐ

वस्तु संरचना ऐ :delay: { "show": 500, "hide": 100 }

html बूलियन false

टूलटिप च एचटीएमएल दी अनुमति देओ।

जेकर सच्च ऐ तां टूलटिप च HTML टैग टूलटिप titleच रेंडर कीते जाङन. जेकर गलत innerTextऐ तां डीओएम च सामग्री गी सम्मिलित करने आस्तै प्रॉपर्टी दा इस्तेमाल कीता जाग.

जेकर तुस XSS हमले दे बारे च चिंतित ओ तां पाठ दा इस्तेमाल करो.

placement तार | फंक्शन 'top'

टूलटिप गी किस चाल्ली पोजीशन देना ऐ - ऑटो | टॉप | नीचे | बाईं ओर | स्हेई.
जदूं autoनिर्दिश्ट कीता जंदा ऐ तां एह् टूलटिप गी गतिशील रूप कन्नै दुबारा उन्मुख करग.

जदूं कुसै फंक्शन दा इस्तेमाल प्लेसमेंट निर्धारत करने आस्तै कीता जंदा ऐ तां इसगी टूलटिप DOM नोड गी अपने पैह् ले तर्क दे रूप च ते ट्रिगर करने आह् ले तत्व DOM नोड गी अपने दुए दे रूप च बुलाया जंदा ऐ। thisसंदर्भ टूलटिप इंस्टेंस पर सेट कीता गेदा ऐ ।

selector तार | गलत false जेकर कोई चयनकर्ता उपलब्ध करोआया गेआ ऐ तां टूलटिप वस्तुएं गी निर्दिश्ट लक्ष्यें गी सौंपेआ जाग. व्यवहार च, इसदा इस्तेमाल गतिशील रूप कन्नै जोड़े गेदे डीओएम तत्वें ( jQuery.onसमर्थन) पर टूलटिप्स गी बी लागू करने लेई कीता जंदा ऐ। एह् ते इक जानकारीपूर्ण उदाहरण दिक्खो .
template डोर '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'

टूलटिप बनांदे बेल्लै बरतने आस्तै एचटीएमएल दा आधार बनाओ।

टूलटिप दा titleइंजेक्ट कीता जाग .tooltip-inner.

.tooltip-arrowटूलटिप दा तीर बन जाह्ग।

सबतूं बाहरले रैपर तत्व च .tooltipवर्ग ते role="tooltip".

title तार | तत्व | फंक्शन ''

titleजेकर विशेषता मौजूद नेईं ऐ तां डिफाल्ट शीर्शक मान .

thisजेकर कोई फंक्शन दित्ता गेदा ऐ तां उसी उस तत्व गी अपने संदर्भ सेट कन्नै बुलाया जाग जिस कन्नै टूलटिप जुड़े दा ऐ।

trigger डोर 'hover focus'

टूलटिप किस चाल्ली ट्रिगर कीता जंदा ऐ - क्लिक करो | होवर करना | फोकस करना | हत्थी. तुस मते सारे ट्रिगर पास करी सकदे ओ; इन्हें इक जगह कन्नै बक्खरा करो।

'manual'.show()दर्शांदा ऐ जे टूलटिप गी प्रोग्रामेटिक रूप कन्नै , .hide()ते .toggle()तरीकें दे राहें ट्रिगर कीता जाग ; इस मान गी कुसै होर ट्रिगर कन्नै नेईं जोड़ेआ जाई सकदा ऐ.

'hover'अपने आपै च टूलटिप दा नतीजा होग जेह् ड़े कीबोर्ड दे राहें ट्रिगर नेईं कीते जाई सकदे न, ते तदूं गै बरतेआ जाना चाहिदा जेकर कीबोर्ड बरतूनी आस्तै इक गै जानकारी देने लेई वैकल्पिक तरीके मौजूद न।

fallbackPlacements सरणी ['top', 'right', 'bottom', 'left'] सरणी च प्लेसमेंटें दी सूची (पसंदी दे क्रम च) उपलब्ध करोआइयै फॉलबैक प्लेसमेंटें गी परिभाशत करो। होर मती जानकारी आस्तै पोपर दे व्यवहार डॉक्स दिक्खो
boundary तार | तत्व 'clippingParents' टूलटिप दी ओवरफ्लो बाधा सीमा (केवल पॉपर दे preventOverflow संशोधक पर लागू होंदी ऐ)। डिफ़ॉल्ट रूप कन्नै एह् 'clippingParents'इक HTMLElement संदर्भ ऐ ते स्वीकार करी सकदा ऐ (केवल जावास्क्रिप्ट दे राहें)। होर मती जानकारी आस्तै दिक्खो Popper's detectOverflow docs .
customClass तार | फंक्शन ''

टूलटिप गी दस्सने पर क्लासें गी जोड़ो। ध्यान रक्खो जे एह् वर्गें गी टेम्पलेट च निर्दिश्ट कुसै बी वर्ग दे अलावा जोड़ेआ जाग। कई वर्गें गी जोड़ने लेई, उनेंगी स्पेस कन्नै बक्ख करो: 'class-1 class-2'.

तुस इक फंक्शन बी पास करी सकदे ओ जेह् ड़ा इक गै स्ट्रिंग रिटर्न करना चाहिदा जिस च अतिरिक्त क्लास दे नांऽ होंदे न.

sanitize बूलियन true सेनेटाइजेशन गी सक्षम जां अक्षम करो। जेकर सक्रिय कीता जाग 'template'ते 'title'विकल्पें गी सेनेटाइज कीता जाग। साढ़े जावास्क्रिप्ट दस्तावेजें च सैनिटाइजर खंड दिक्खो .
allowList चीज डिफ़ॉल्ट मान ऐ वस्तु जिस च अनुमति दित्ती गेदी विशेषताएं ते टैग होंदे न
sanitizeFn शून्य | फंक्शन null इत्थें तुस अपने सेनेटाइज फंक्शन गी सप्लाई करी सकदे ओ। जेकर तुस सेनेटाइजेशन करने लेई समर्पित लाइब्रेरी दा इस्तेमाल करना पसंद करदे ओ तां एह् फायदेमंद होई सकदा ऐ।
offset सरणी | तार | फंक्शन [0, 0]

टूलटिप दा अपने लक्ष्य दे सापेक्ष ऑफसेट। तुस अल्पविराम कन्नै बक्ख कीते गेदे मूल्यें कन्नै डेटा विशेषताएं च इक स्ट्रिंग पास करी सकदे ओ जि’यां:data-bs-offset="10,20"

जदूं कुसै फंक्शन दा इस्तेमाल ऑफसेट निर्धारत करने आस्तै कीता जंदा ऐ तां इसगी इक वस्तु कन्नै बुलाया जंदा ऐ जिस च पॉपर प्लेसमेंट, संदर्भ, ते पॉपर रेक्ट्स गी इसदे पैह् ले तर्क दे रूप च शामल कीता जंदा ऐ। ट्रिगर करने आह् ले तत्व DOM नोड गी दुए तर्क दे रूप च पास कीता जंदा ऐ। फंक्शन गी दो नंबरें कन्नै इक सरणी वापस करना होग: .[skidding, distance]

होर मती जानकारी आस्तै दिक्खो पोपर दे ऑफसेट डॉक्स .

popperConfig शून्य | वस्तु | फंक्शन null

बूटस्ट्रैप दी डिफाल्ट पॉपर कॉन्फ़िगरेशन बदलने लेई, दिक्खो पॉपर कॉन्फ़िगरेशन .

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

व्यक्तिगत टूलटिप्स आस्तै डेटा विशेषताएं

व्यक्तिगत टूलटिप्स आस्तै विकल्पें गी वैकल्पिक रूप कन्नै डेटा विशेषताएं दे इस्तेमाल दे माध्यम कन्नै निर्दिश्ट कीता जाई सकदा ऐ, जि’यां उप्पर दित्ते गेदे न।

कन्नै फंक्शन दा इस्तेमाल करनाpopperConfig

var tooltip = new bootstrap.Tooltip(element, {
  popperConfig: function (defaultBsPopperConfig) {
    // var newPopperConfig = {...}
    // use defaultBsPopperConfig if needed...
    // return newPopperConfig
  }
})

विधियां

एसिंक्रोनस तरीके ते संक्रमण

सारे एपीआई तरीके एसिंक्रोनस न ते इक संक्रमण शुरू करदे न . संक्रमण शुरू होने दे बाद गै ओह् काल करने आह् ले कोल वापस औंदे न पर खत्म होने थमां पैह् ले . इसदे अलावा, इक संक्रमण घटक पर इक विधि काल गी अनदेखा कीता जाग .

होर मती जानकारी आस्तै साढ़े जावास्क्रिप्ट दस्तावेज़ीकरण दिक्खो .

शो

इक तत्व दी टूलटिप दा खुलासा करदा ऐ। टूलटिप गी असल च दस्से जाने थमां पैह् ले (यानी shown.bs.tooltipघटना होने थमां पैह् ले) कॉलर गी वापस करदा ऐ। इसगी टूलटिप दा इक "मैनुअल" ट्रिगरिंग मन्नेआ जंदा ऐ। शून्य-लंबाई आह् ले शीर्शक आह् ले टूलटिप कदें बी प्रदर्शत नेईं कीते जंदे न.

tooltip.show()

छिप्पो

इक तत्व दी टूलटिप गी छुपांदा ऐ। टूलटिप गी असल च छिपाने थमां पैह् ले (यानी hidden.bs.tooltipघटना होने थमां पैह् ले) कॉलर गी वापस करदा ऐ। इसगी टूलटिप दा इक "मैनुअल" ट्रिगरिंग मन्नेआ जंदा ऐ।

tooltip.hide()

टॉगल करदे

इक तत्व दी टूलटिप गी टॉगल करदा ऐ। टूलटिप गी असल च दस्सने जां छिपाने थमां पैह् ले (यानी shown.bs.tooltipजां hidden.bs.tooltipघटना होने थमां पैह् ले) कॉलर गी वापस करदा ऐ। इसगी टूलटिप दा इक "मैनुअल" ट्रिगरिंग मन्नेआ जंदा ऐ।

tooltip.toggle()

निपटान करना

इक तत्व दे टूलटिप गी छुपांदा ऐ ते नष्ट करदा ऐ (DOM तत्व पर संग्रहीत डेटा गी हटांदा ऐ)। टूलटिप जेह् ड़े डेलिगेशन दा उपयोग करदे न (जेह् ड़े विकल्प दा उपयोग करियैselector बनाई गेदे न ) गी वंशज ट्रिगर तत्वें पर व्यक्तिगत रूप कन्नै नष्ट नेईं कीता जाई सकदा ऐ.

tooltip.dispose()

समर्थ

इक तत्व दे टूलटिप गी दस्सने दी क्षमता दिंदा ऐ। टूलटिप्स डिफ़ॉल्ट रूप कन्नै सक्षम कीते गेदे न।

tooltip.enable()

नकारा

इक तत्व दे टूलटिप गी दस्सेआ जाने आह् ली क्षमता गी हटांदा ऐ। टूलटिप गी तदूं गै दस्सेआ जाई सकदा ऐ जेकर एह् दुबारा सक्षम कीता गेदा ऐ.

tooltip.disable()

टॉगलसक्षम कीता गेदा ऐ

इक तत्व दे टूलटिप गी दस्सने जां छिपाने दी क्षमता गी टॉगल करदा ऐ.

tooltip.toggleEnabled()

अपडेट

इक तत्व दी टूलटिप दी स्थिति गी अपडेट करदा ऐ।

tooltip.update()

getInstance दा

स्थिर विधि जेह् ड़ी तुसेंगी इक DOM तत्व कन्नै जुड़े दा टूलटिप इंस्टेंस हासल करने दी इजाजत दिंदी ऐ

var exampleTriggerEl = document.getElementById('example')
var tooltip = bootstrap.Tooltip.getInstance(exampleTriggerEl) // Returns a Bootstrap tooltip instance

getOrCreateInstance ऐ

स्थिर विधि जेह् ड़ी तुसेंगी इक DOM तत्व कन्नै जुड़ी दी टूलटिप इंस्टेंस हासल करने दी इजाजत दिंदी ऐ , जां इस मामले च इक नमां बनाने दी इजाजत दिंदी ऐ जेकर एह् शुरू नेईं कीती गेई ही

var exampleTriggerEl = document.getElementById('example')
var tooltip = bootstrap.Tooltip.getOrCreateInstance(exampleTriggerEl) // Returns a Bootstrap tooltip instance

घटनाएं

घटना दा प्रकार ब्यौरा
show.bs.tooltip showइंस्टेंस विधि गी बुलाने पर एह् घटना तुरत फायर होई जंदी ऐ।
shown.bs.tooltip एह् घटना उस बेल्लै फायर कीती जंदी ऐ जिसलै टूलटिप गी बरतूनी गी दिक्खने आह् ला बनाया गेआ ऐ (सीएसएस संक्रमणें गी पूरा होने दा इंतजार करग)।
hide.bs.tooltip इस घटना गी फौरन फायर कीता जंदा ऐ जिसलै hideइंस्टेंस विधि गी बुलाया गेआ ऐ.
hidden.bs.tooltip एह् घटना उस बेल्लै फायर कीती जंदी ऐ जिसलै टूलटिप बरतूनी थमां छिपाना समाप्त होई जंदा ऐ (CSS संक्रमणें गी पूरा होने दा इंतजार करग)।
inserted.bs.tooltip एह् घटना उस show.bs.tooltipघटना दे बाद फायर कीती जंदी ऐ जिसलै टूलटिप टेम्पलेट गी DOM च जोड़ेआ गेआ ऐ.
var myTooltipEl = document.getElementById('myTooltip')
var tooltip = new bootstrap.Tooltip(myTooltipEl)

myTooltipEl.addEventListener('hidden.bs.tooltip', function () {
  // do something...
})

tooltip.hide()