टूलटिप्स दा
एनीमेशनें लेई CSS3 दा उपयोग करदे होई CSS ते जावास्क्रिप्ट कन्नै कस्टम बूटस्ट्रैप टूलटिप्स जोड़ने आस्तै दस्तावेजीकरण ते उदाहरण ते लोकल टाइटल भंडारण आस्तै डेटा-बीएस-एट्रिब्यूट।
अवलोकन करना
टूलटिप प्लगइन दा इस्तेमाल करदे बेल्लै जानने आह्लियां गल्लां:
- टूलटिप्स पोजीशनिंग लेई 3rd पार्टी लाइब्रेरी पॉपर पर निर्भर करदे न । टूलटिप्स गी कम्म करने आस्तै तुसेंगी bootstrap.js थमां पैह् ले popper.min.js गी शामल करना होग जां
bootstrap.bundle.min.js
/ दा इस्तेमाल करना होगbootstrap.bundle.js
जेह् ड़ा Popper गी शामल करदा ऐ ! - टूलटिप्स प्रदर्शन कारणें कन्नै ऑप्ट-इन न , इसलेई तुसेंगी अपने आपै गी उनेंगी शुरू करना होग .
- शून्य-लंबाई आह् ले शीर्शक आह् ले टूलटिप कदें बी प्रदर्शत नेईं कीते जंदे न.
- होर जटिल घटकें च रेंडरिंग समस्याएं थमां बचने आस्तै निर्दिश्ट करो
container: 'body'
(जियां साढ़े इनपुट समूह, बटन समूह बगैरा)। - छिपे दे तत्वें पर टूलटिप्स गी ट्रिगर करना कम्म नेईं करग.
.disabled
या तत्वें लेई टूलटिप्सdisabled
गी इक रैपर तत्व पर ट्रिगर ���ीता जाना लोड़चदा ऐ।- जदूं हाइपरलिंक थमां ट्रिगर कीता जंदा ऐ जेह् ड़े मते सारे लाइनें च फैले दे न, तां टूलटिप्स केंद्रत होङन। इस बर्ताव कोला बचने लेई
white-space: nowrap;
अपने एस पर इस्तेमाल करो ।<a>
- टूलटिप्स गी उंदे सरबंधत तत्वें गी डीओएम थमां हटाने थमां पैह् ले छिपाना लोड़चदा ऐ.
- टूलटिप्स गी इक शैडो डीओएम दे अंदर इक तत्व दी बदौलत ट्रिगर कीता जाई सकदा ऐ।
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-responsive
boundary
popperConfig
'clippingParents'
document.body
var exampleEl = document.getElementById('example')
var tooltip = new bootstrap.Tooltip(exampleEl, {
boundary: document.body // or document.querySelector('#boundary')
})
मार्कअप करना
टूलटिप आस्तै लोड़चदा मार्कअप सिर्फ इक data
विशेषता ऐ ते title
HTML तत्व पर तुस इक टूलटिप होना चांह् दे ओ. टूलटिप दा जनरेट कीता गेदा मार्कअप बल्के सरल ऐ, हालांकि इसगी इक स्थिति दी लोड़ ऐ (डिफ़ॉल्ट रूप कन्नै, 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 |
टूलटिप गी इक विशिष्ट तत्व कन्नै जोड़दा ऐ। उदाहरण : |
delay |
नंबर | चीज | 0 |
टूलटिप (ms) गी दस्सने ते छिपाने च देरी - मैन्युअल ट्रिगर प्रकार पर लागू नेईं होंदा ऐ जेकर कोई नंबर सप्लाई कीता जंदा ऐ तां छुपा/दिक्खो दोनें पर देरी लागू कीती जंदी ऐ वस्तु संरचना ऐ : |
html |
बूलियन | false |
टूलटिप च एचटीएमएल दी अनुमति देओ। जेकर सच्च ऐ तां टूलटिप च HTML टैग टूलटिप जेकर तुस XSS हमले दे बारे च चिंतित ओ तां पाठ दा इस्तेमाल करो. |
placement |
तार | फंक्शन | 'top' |
टूलटिप गी किस चाल्ली पोजीशन देना ऐ - ऑटो | टॉप | नीचे | बाईं ओर | स्हेई. जदूं कुसै फंक्शन दा इस्तेमाल प्लेसमेंट निर्धारत करने आस्तै कीता जंदा ऐ तां इसगी टूलटिप DOM नोड गी अपने पैह् ले तर्क दे रूप च ते ट्रिगर करने आह् ले तत्व DOM नोड गी अपने दुए दे रूप च बुलाया जंदा ऐ। |
selector |
तार | गलत | false |
जेकर कोई चयनकर्ता उपलब्ध करोआया गेआ ऐ तां टूलटिप वस्तुएं गी निर्दिश्ट लक्ष्यें गी सौंपेआ जाग. व्यवहार च, इसदा इस्तेमाल गतिशील रूप कन्नै जोड़े गेदे डीओएम तत्वें ( jQuery.on समर्थन) पर टूलटिप्स गी बी लागू करने लेई कीता जंदा ऐ। एह् ते इक जानकारीपूर्ण उदाहरण दिक्खो . |
template |
डोर | '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>' |
टूलटिप बनांदे बेल्लै बरतने आस्तै एचटीएमएल दा आधार बनाओ। टूलटिप दा
सबतूं बाहरले रैपर तत्व च |
title |
तार | तत्व | फंक्शन | '' |
|
trigger |
डोर | 'hover focus' |
टूलटिप किस चाल्ली ट्रिगर कीता जंदा ऐ - क्लिक करो | होवर करना | फोकस करना | हत्थी. तुस मते सारे ट्रिगर पास करी सकदे ओ; इन्हें इक जगह कन्नै बक्खरा करो।
|
fallbackPlacements |
सरणी | ['top', 'right', 'bottom', 'left'] |
सरणी च प्लेसमेंटें दी सूची (पसंदी दे क्रम च) उपलब्ध करोआइयै फॉलबैक प्लेसमेंटें गी परिभाशत करो। होर मती जानकारी आस्तै पोपर दे व्यवहार डॉक्स दिक्खो |
boundary |
तार | तत्व | 'clippingParents' |
टूलटिप दी ओवरफ्लो बाधा सीमा (केवल पॉपर दे preventOverflow संशोधक पर लागू होंदी ऐ)। डिफ़ॉल्ट रूप कन्नै एह् 'clippingParents' इक HTMLElement संदर्भ ऐ ते स्वीकार करी सकदा ऐ (केवल जावास्क्रिप्ट दे राहें)। होर मती जानकारी आस्तै दिक्खो Popper's detectOverflow docs . |
customClass |
तार | फंक्शन | '' |
टूलटिप गी दस्सने पर क्लासें गी जोड़ो। ध्यान रक्खो जे एह् वर्गें गी टेम्पलेट च निर्दिश्ट कुसै बी वर्ग दे अलावा जोड़ेआ जाग। कई वर्गें गी जोड़ने लेई, उनेंगी स्पेस कन्नै बक्ख करो: तुस इक फंक्शन बी पास करी सकदे ओ जेह् ड़ा इक गै स्ट्रिंग रिटर्न करना चाहिदा जिस च अतिरिक्त क्लास दे नांऽ होंदे न. |
sanitize |
बूलियन | true |
सेनेटाइजेशन गी सक्षम जां अक्षम करो। जेकर सक्रिय कीता जाग 'template' ते 'title' विकल्पें गी सेनेटाइज कीता जाग। साढ़े जावास्क्रिप्ट दस्तावेजें च सैनिटाइजर खंड दिक्खो . |
allowList |
चीज | डिफ़ॉल्ट मान ऐ | वस्तु जिस च अनुमति दित्ती गेदी विशेषताएं ते टैग होंदे न |
sanitizeFn |
शून्य | फंक्शन | null |
इत्थें तुस अपने सेनेटाइज फंक्शन गी सप्लाई करी सकदे ओ। जेकर तुस सेनेटाइजेशन करने लेई समर्पित लाइब्रेरी दा इस्तेमाल करना पसंद करदे ओ तां एह् फायदेमंद होई सकदा ऐ। |
offset |
सरणी | तार | फंक्शन | [0, 0] |
टूलटिप दा अपने लक्ष्य दे सापेक्ष ऑफसेट। तुस अल्पविराम कन्नै बक्ख कीते गेदे मूल्यें कन्नै डेटा विशेषताएं च इक स्ट्रिंग पास करी सकदे ओ जि’यां: जदूं कुसै फंक्शन दा इस्तेमाल ऑफसेट निर्धारत करने आस्तै कीता जंदा ऐ तां इसगी इक वस्तु कन्नै बुलाया जंदा ऐ जिस च पॉपर प्लेसमेंट, संदर्भ, ते पॉपर रेक्ट्स गी इसदे पैह् ले तर्क दे रूप च शामल कीता जंदा ऐ। ट्रिगर करने आह् ले तत्व DOM नोड गी दुए तर्क दे रूप च पास कीता जंदा ऐ। फंक्शन गी दो नंबरें कन्नै इक सरणी वापस करना होग: . होर मती जानकारी आस्तै दिक्खो पोपर दे ऑफसेट डॉक्स . |
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()