Source

সঁজুলিৰ টিপছ

স্থানীয় শিৰোনাম সংৰক্ষণৰ বাবে এনিমেচন আৰু ডাটা-বৈশিষ্ট্যসমূহৰ বাবে CSS3 ব্যৱহাৰ কৰি CSS আৰু JavaScript ৰ সৈতে স্বনিৰ্বাচিত বুটষ্ট্ৰেপ সঁজুলি টিপসমূহ যোগ কৰাৰ বাবে দস্তাবেজ আৰু উদাহৰণসমূহ।

অভাৰভিউ

সঁজুলি টিপ প্লাগ-ইন ব্যৱহাৰ কৰাৰ সময়ত জানিবলগীয়া কথাবোৰ:

  • সঁজুলিটিপসমূহ অৱস্থানৰ বাবে তৃতীয় পক্ষৰ লাইব্ৰেৰী Popper.js ৰ ওপৰত নিৰ্ভৰ কৰে । আপুনি bootstrap.js ৰ আগতে popper.min.js অন্তৰ্ভুক্ত কৰিব লাগিব বা bootstrap.bundle.min.js/ ব্যৱহাৰ কৰিব লাগিব bootstrap.bundle.jsযি Popper.js ধাৰণ কৰে সঁজুলি টিপসমূহে কাম কৰিবলে!
  • যদি আপুনি আমাৰ জাভাস্ক্রিপ্ট উৎসৰ পৰা নিৰ্মাণ কৰি আছে, ইয়াৰ বাবে প্ৰয়োজনutil.js ।
  • সঁজুলি টিপসমূহ পৰিৱেশনৰ কাৰণে অপ্ট-ইন হয়, গতিকে আপুনি নিজেই সিহতক আৰম্ভ কৰিব লাগিব ।
  • শূন্য-দৈৰ্ঘ্যৰ শিৰোনাম থকা সঁজুলিটিপসমূহ কেতিয়াও প্ৰদৰ্শিত নহয়।
  • container: 'body'অধিক জটিল উপাদানসমূহত ৰেণ্ডাৰ সমস্যা এৰাই চলিবলৈ ধাৰ্য্য কৰক (যেনে আমাৰ ইনপুট গোটসমূহ, বুটাম গোটসমূহ, ইত্যাদি)।
  • লুকাই থকা উপাদানসমূহৰ ওপৰত সঁজুলি টিপসমূহ ট্ৰিগাৰ কৰিলে কাম নহ'ব।
  • .disabledবা উপাদানসমূহৰ বাবে সঁজুলিটিপসমূহ disabledএটা ৰেপাৰ উপাদানত ট্ৰিগাৰ কৰিব লাগিব।
  • যেতিয়া একাধিক শাৰীত বিস্তৃত হাইপাৰলিংকৰ পৰা ট্ৰিগাৰ কৰা হয়, সঁজুলি টিপসমূহ কেন্দ্ৰীভূত কৰা হ'ব। এই আচৰণ এৰাই চলিবলৈ white-space: nowrap;আপোনাৰ s ত ব্যৱহাৰ কৰক ।<a>
  • সঁজুলি টিপসমূহ সিহতৰ সংশ্লিষ্ট উপাদানসমূহ DOM ৰ পৰা আঁতৰোৱাৰ আগতে লুকুৱাব লাগিব।
  • এটা ছাঁ DOM ৰ ভিতৰৰ এটা উপাদানৰ বাবে টুলটিপসমূহ ট্ৰিগাৰ কৰিব পাৰি।

এই উপাদানৰ এনিমেচন প্ৰভাৱ prefers-reduced-motionমাধ্যম প্ৰশ্নৰ ওপৰত নিৰ্ভৰশীল। আমাৰ অভিগম্যতা নথিপত্ৰৰ হ্ৰাস কৰা গতি অংশ চাওক ।

সেই সকলোবোৰ পাইছেনে? মহান, কিছুমান উদাহৰণৰ সৈতে তেওঁলোকে কেনেকৈ কাম কৰে চাওঁ আহক।

উদাহৰণ: সকলোতে সঁজুলি টিপসমূহ সামৰ্থবান কৰক

এটা পৃষ্ঠাত সকলো সঁজুলি টিপ আৰম্ভ কৰাৰ এটা উপায় হ'ব সিহতক সিহঁতৰ data-toggleবৈশিষ্ট্য অনুসৰি নিৰ্ব্বাচন কৰা:

$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})

উদাহৰণ

সঁজুলি টিপছ চাবলৈ তলৰ লিংকসমূহৰ ওপৰত মাউছ কৰক:

টাইট পেণ্ট নেক্সট লেভেল কেফিয়েহ আপুনি হয়তো শুনা নাই। ফটো বুথ দাড়ি কেঁচা ডেনিম লেটাৰপ্ৰেছ ভেগান মেচেঞ্জাৰ বেগ stumptown. ফাৰ্ম-টু-টেবল seitan, mcsweeney's fixie বহনক্ষম quinoa 8-বিট আমেৰিকান পোছাক এটা টেৰী richardson vinyl chambray আছে. দাড়ি ষ্টাম্পটাউন, কাৰ্ডিগান বানহ মি লোমো থাণ্ডাৰকেটছ। টোফু বায়'ডিজেল উইলিয়ামছবাৰ্গ মাৰ্ফা, চাৰিটা লোকো mcsweeney's ক্লিনজ ভেগান chambray. 'এটা সঁচাকৈয়ে বিদ্ৰুপৰ শিল্পী যিয়েই নহওক কিয় keytar , scenester ফাৰ্ম-টু-টেবুল banksy অষ্টিন টুইটাৰ হেণ্ডেল freegan cred কেঁচা ডেনিম একক-উৎপত্তি কফি ভাইৰেল.

চাৰিটা সঁজুলি টিপছৰ দিশ চাবলৈ তলৰ বুটামসমূহৰ ওপৰত মাউছ কৰক: ওপৰ, সোঁ, তললৈ, আৰু বাওঁ।

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

আৰু কাষ্টম HTML যোগ কৰা হৈছে:

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

ব্যৱহাৰ

সঁজুলিটিপ প্লাগিনে চাহিদাৰ ওপৰত বিষয়বস্তু আৰু মাৰ্কআপ সৃষ্টি কৰে, আৰু অবিকল্পিতভাৱে সঁজুলিটিপসমূহ সিহতৰ ট্ৰিগাৰ উপাদানৰ পিছত ৰাখে।

জাভাস্ক্রিপ্টৰ যোগেদি সঁজুলিটিপ ট্ৰিগাৰ কৰক:

$('#example').tooltip(options)
অভাৰফ্ল' autoআৰুscroll

সঁজুলিটিপৰ অৱস্থানে স্বয়ংক্ৰিয়ভাৱে সলনি কৰিবলৈ চেষ্টা কৰে যেতিয়া এটা মূল ধাৰক আমাৰ আছে overflow: autoবা overflow: scrollভাল পায় .table-responsive, কিন্তু তথাপিও মূল স্থানৰ অৱস্থান ৰাখে। সমাধান কৰিবলে, boundaryবিকল্পক অবিকল্পিত মানৰ বাহিৰে অন্য যিকোনো লে সংহতি কৰক, 'scrollParent', যেনে 'window':

$('#example').tooltip({ boundary: 'window' })

মাৰ্কআপ

এটা সঁজুলিটিপৰ বাবে প্ৰয়োজনীয় মাৰ্কআপ কেৱল এটা dataবৈশিষ্ট্য আৰু titleHTML উপাদানত আপুনি এটা সঁজুলিটিপ পাব বিচাৰে। এটা সঁজুলিটিপৰ সৃষ্টি কৰা মাৰ্কআপ যথেষ্ট সহজ, যদিও ইয়াৰ বাবে এটা অৱস্থানৰ প্ৰয়োজন (অবিকল্পিতভাৱে, topপ্লাগ-ইনৰ দ্বাৰা সংহতি কৰা)।

কিবৰ্ড আৰু সহায়ক প্ৰযুক্তি ব্যৱহাৰকাৰীসকলৰ বাবে সঁজুলি টিপসমূহ কাম কৰা

আপুনি কেৱল HTML উপাদানসমূহত সঁজুলি টিপসমূহ যোগ কৰিব লাগে যি পৰম্পৰাগতভাৱে কিবৰ্ড-কেন্দ্ৰিক আৰু পাৰস্পৰিক (যেনে সংযোগসমূহ বা প্ৰপত্ৰ নিয়ন্ত্ৰণসমূহ)। যদিও ইচ্ছাকৃত HTML উপাদানসমূহক (যেনে <span>s) বৈশিষ্ট্য যোগ কৰি কেন্দ্ৰীভূত কৰিব পাৰি tabindex="0", ই কিবৰ্ড ব্যৱহাৰকাৰীসকলৰ বাবে অ-পাৰস্পৰিক উপাদানসমূহত সম্ভাৱ্যভাৱে বিৰক্তিকৰ আৰু বিভ্ৰান্তিকৰ টেব ষ্টপসমূহ যোগ কৰিব। ইয়াৰ উপৰিও এই পৰিস্থিতিত বৰ্তমান বেছিভাগ সহায়ক প্ৰযুক্তিয়ে টুলটিপ ঘোষণা নকৰে।

অতিৰিক্তভাৱে, কেৱল আপোনাৰ সঁজুলিটিপৰ বাবে ট্ৰিগাৰ হিচাপে নিৰ্ভৰ নকৰিব hover, কাৰণ ই আপোনাৰ সঁজুলিটিপসমূহক কিবৰ্ড ব্যৱহাৰকাৰীসকলৰ বাবে ট্ৰিগাৰ কৰাটো অসম্ভৱ কৰি তুলিব।

<!-- HTML to write -->
<a href="#" data-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="arrow"></div>
  <div class="tooltip-inner">
    Some tooltip text!
  </div>
</div>

নিষ্ক্ৰিয় উপাদানসমূহ

বৈশিষ্ট্য থকা উপাদানসমূহ disabledপাৰস্পৰিক নহয়, অৰ্থাৎ ব্যৱহাৰকাৰীসকলে এটা সঁজুলিটিপ (বা পপঅভাৰ) ট্ৰিগাৰ কৰিবলে সিহতক ফ'কাচ, হোভাৰ, বা ক্লিক কৰিব নোৱাৰে। এটা ৱৰ্কআৰউণ্ড হিচাপে, আপুনি এটা ৰেপাৰৰ পৰা সঁজুলিটিপ ট্ৰিগাৰ কৰিব বিচাৰিব <div>বা <span>, আদৰ্শভাৱে ব্যৱহাৰ কৰি কিবৰ্ড-ফ'কাচযোগ্য কৰা , আৰু নিষ্ক্ৰিয় উপাদানত tabindex="0"অভাৰৰাইড কৰিব বিচাৰিব।pointer-events

<span class="d-inline-block" tabindex="0" data-toggle="tooltip" title="Disabled tooltip">
  <button class="btn btn-primary" style="pointer-events: none;" type="button" disabled>Disabled button</button>
</span>

বিকল্পসমূহ

বিকল্পসমূহ ডাটা এট্ৰিবিউট বা জাভাস্ক্রিপ্টৰ যোগেদি পাছ কৰিব পাৰি। তথ্য বৈশিষ্ট্যসমূহৰ বাবে, বিকল্পৰ নাম ত সংযুক্ত কৰক data-, যেনে data-animation="".

নাম প্ৰকাৰ ডিফল্ট বিৱৰণ
এনিমেচন বুলিয়ান সঁচা সঁজুলিটিপত এটা CSS ফেড পৰিৱৰ্তন প্ৰয়োগ কৰক
পাত্ৰ ষ্ট্ৰিং | উপাদান | মিছা মিছা

এটা নিৰ্দিষ্ট উপাদানত সঁজুলিটিপ সংযোজন কৰে। উদাহৰণ: container: 'body'. এই বিকল্প বিশেষভাৱে উপযোগী কাৰণ ই আপোনাক ট্ৰিগাৰিং উপাদানৰ ওচৰত দস্তাবেজৰ প্ৰবাহত সঁজুলিটিপ স্থাপন কৰাৰ অনুমতি দিয়ে - যি এটা উইন্ডো আকাৰ সলনি কৰাৰ সময়ত সঁজুলিটিপক ট্ৰিগাৰিং উপাদানৰ পৰা আঁতৰত ওপঙি থকাত বাধা দিব।
পলম কৰা সংখ্যা | বস্তু ০

সঁজুলিটিপ দেখুৱা আৰু লুকুৱাবলৈ বিলম্ব (ms) - হস্তচালিত ট্ৰিগাৰ ধৰণৰ বাবে প্ৰযোজ্য নহয়

যদি এটা নম্বৰ যোগান ধৰা হয়, তেন্তে লুকুৱাই/দেখা দুয়োটাতে বিলম্ব প্ৰয়োগ কৰা হয়

বস্তুৰ গঠন হ'ল:delay: { "show": 500, "hide": 100 }
html বুলিয়ান মিছা

টুলটিপত HTML ৰ অনুমতি দিয়ক।

যদি সঁচা, সঁজুলি টিপত থকা HTML টেগসমূহ সঁজুলি টিপত titleৰেণ্ডাৰ কৰা হ'ব। যদি মিছা, jQuery ৰ textপদ্ধতি DOM ত বিষয়বস্তু সন্নিৱিষ্ট কৰিবলে ব্যৱহাৰ কৰা হব।

XSS আক্ৰমণৰ বাবে চিন্তিত হ'লে লিখা ব্যৱহাৰ কৰক।
প্লেচমেণ্ট ষ্ট্ৰিং | অনুষ্ঠান 'শীৰ্ষ'

টুলটিপ কেনেকৈ পজিচন কৰিব - auto | শীৰ্ষ | তলৰ | বাওঁফালে | শুদ্ধ.
যেতিয়া autoধাৰ্য্য কৰা হয়, ই গতিশীলভাৱে সঁজুলিটিপক পুনৰায় দিশ নিৰ্ধাৰণ কৰিব।

যেতিয়া এটা ফাংচন স্থাপন নিৰ্ধাৰণ কৰিবলৈ ব্যৱহাৰ কৰা হয়, ইয়াক সঁজুলিটিপ DOM ন'ডক ইয়াৰ প্ৰথম যুক্তি হিচাপে আৰু ট্ৰিগাৰিং উপাদান DOM ন'ডক ইয়াৰ দ্বিতীয় হিচাপে লৈ কল কৰা হয়। thisপ্ৰসংগটো সঁজুলিটিপ উদাহৰণলৈ সংহতি কৰা হৈছে ।
নিৰ্বাচক ষ্ট্ৰিং | মিছা মিছা যদি এটা নিৰ্বাচক প্ৰদান কৰা হয়, সঁজুলিটিপ বস্তুসমূহক ধাৰ্য্য কৰা লক্ষ্যসমূহলে প্ৰত্যায়িত কৰা হ'ব। কাৰ্য্যত, ইয়াক গতিশীলভাৱে যোগ কৰা DOM উপাদানসমূহলে সঁজুলি টিপসমূহ প্ৰয়োগ কৰিবলেও ব্যৱহাৰ কৰা হয় ( jQuery.onসমৰ্থন)। এইটো আৰু এটা তথ্যসমৃদ্ধ উদাহৰণ চাওক ।
সাঁচ তাঁৰ '<div class="tooltip" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>'

সঁজুলিটিপ সৃষ্টি কৰাৰ সময়ত ব্যৱহাৰ কৰিবলৈ HTML ভিত্তি কৰক।

টুলটিপৰ titleসমূহ ইনজেকচন কৰা হ'ব .tooltip-inner।

.arrowটুলটিপৰ কাঁড় চিহ্ন হৈ পৰিব।

আটাইতকৈ বাহিৰৰ ৰেপাৰ উপাদানটোৰ .tooltipশ্ৰেণীটো থাকিব লাগে আৰু role="tooltip".
অলপ ষ্ট্ৰিং | উপাদান | অনুষ্ঠান ''

titleবৈশিষ্ট্য উপস্থিত নাথাকিলে অবিকল্পিত শিৰোনাম মান ।

thisযদি এটা ফাংচন দিয়া হয়, তেন্তে ইয়াক টুলটিপ সংযুক্ত উপাদানটোৰ সৈতে ইয়াৰ ৰেফাৰেন্স ছেট কৰি কল কৰা হ’ব ।
ট্ৰিগাৰ তাঁৰ 'hover focus'

টুলটিপ কেনেকৈ ট্ৰিগাৰ কৰা হয় - | ক্লিক কৰক hover | ফোকাচ | হাতপুথি. আপুনি একাধিক ট্ৰিগাৰ পাছ কৰিব পাৰে; ইহঁতক এটা স্থান দি পৃথক কৰক।

'manual'.tooltip('show')ইংগিত দিয়ে যে সঁজুলিটিপক , .tooltip('hide')আৰু পদ্ধতিসমূহৰ যোগেদি প্ৰগ্ৰামেটিকভাৱে ট্ৰিগাৰ কৰা হ'ব .tooltip('toggle'); এই মান অন্য কোনো ট্ৰিগাৰৰ সৈতে সংযুক্ত কৰিব নোৱাৰি।

'hover'ইয়াৰ ফলত সঁজুলি টিপসমূহ হ'ব যি কিবৰ্ডৰ যোগেদি ট্ৰিগাৰ কৰিব নোৱাৰি, আৰু কেৱল ব্যৱহাৰ কৰিব লাগে যদি কিবৰ্ড ব্যৱহাৰকাৰীসকলৰ বাবে একে তথ্য প্ৰেৰণ কৰাৰ বিকল্প পদ্ধতিসমূহ উপস্থিত থাকে।
অফছেট সংখ্যা | তাঁৰ ০ ইয়াৰ লক্ষ্যৰ সাপেক্ষে সঁজুলিটিপৰ অফছেট। অধিক তথ্যৰ বাবে Popper.js ৰ অফছেট নথিপত্ৰ চাওক ।
fallbackপ্লেচমেন্ট ষ্ট্ৰিং | এৰে 'ওলোটা কৰা' ফ'লবেকত পপাৰে কোনটো অৱস্থান ব্যৱহাৰ কৰিব সেইটো নিৰ্দিষ্ট কৰিবলৈ অনুমতি দিয়ক। অধিক তথ্যৰ বাবে Popper.js ৰ আচৰণ নথিপত্ৰসমূহ চাওক
সীমা ষ্ট্ৰিং | উপাদান 'scrollParent' সঁজুলিটিপৰ অভাৰফ্ল' বাধা সীমা। 'viewport', 'window', 'scrollParent', বা এটা HTMLElement প্ৰসংগ (কেৱল জাভাস্ক্রিপ্ট) ৰ মানসমূহ গ্ৰহণ কৰে । অধিক তথ্যৰ বাবে Popper.js ৰ preventOverflow docs চাওক ।

ব্যক্তিগত সঁজুলি টিপসমূহৰ বাবে তথ্য বৈশিষ্ট্যসমূহ

ব্যক্তিগত সঁজুলি টিপসমূহৰ বাবে বিকল্পসমূহ বিকল্পভাৱে তথ্য বৈশিষ্ট্যসমূহৰ ব্যৱহাৰৰ যোগেদি ধাৰ্য্য কৰিব পাৰি, ওপৰত ব্যাখ্যা কৰা ধৰণে।

পদ্ধতিসমূহ

এচিংক্ৰ’নাছ পদ্ধতি আৰু পৰিৱৰ্তন

সকলো API পদ্ধতি এচিনক্ৰ'নাছ আৰু এটা পৰিৱৰ্তন আৰম্ভ কৰে । ট্ৰেঞ্জিচন আৰম্ভ হোৱাৰ লগে লগে কিন্তু শেষ হোৱাৰ আগতেই তেওঁলোকে কল কৰাজনৰ ওচৰলৈ উভতি যায় ৷ ইয়াৰ উপৰিও, এটা পৰিৱৰ্তনশীল উপাদানত এটা পদ্ধতি কল আওকাণ কৰা হ'ব ।

অধিক তথ্যৰ বাবে আমাৰ জাভাস্ক্রিপ্ট আলেখ্যন চাওক ।

$().tooltip(options)

এটা উপাদান সংগ্ৰহৰ সৈতে এটা সঁজুলিটিপ নিয়ন্ত্ৰক সংযুক্ত কৰে।

.tooltip('show')

এটা উপাদানৰ সঁজুলিটিপ প্ৰকাশ কৰে। সঁজুলিটিপ প্ৰকৃততে দেখুওৱাৰ আগতে (অৰ্থাৎ shown.bs.tooltipইভেন্টটো ঘটাৰ আগতে) কলাৰলৈ উভতি যায়। ইয়াক টুলটিপৰ “মেনুৱেল” ট্ৰিগাৰিং বুলি গণ্য কৰা হয়। শূন্য-দৈৰ্ঘ্যৰ শিৰোনাম থকা সঁজুলিটিপসমূহ কেতিয়াও প্ৰদৰ্শিত নহয়।

$('#element').tooltip('show')

.tooltip('hide')

এটা উপাদানৰ সঁজুলিটিপ লুকুৱাই ৰাখে। সঁজুলিটিপ প্ৰকৃততে লুকুৱাই ৰখাৰ আগতে (অৰ্থাৎ hidden.bs.tooltipইভেন্টটো ঘটাৰ আগতে) কলাৰলৈ উভতি যায়। ইয়াক টুলটিপৰ “মেনুৱেল” ট্ৰিগাৰিং বুলি গণ্য কৰা হয়।

$('#element').tooltip('hide')

.tooltip('toggle')

এটা উপাদানৰ সঁজুলিটিপ টগল কৰে। সঁজুলিটিপ প্ৰকৃততে দেখুৱা বা লুকুৱাই ৰখাৰ আগতে (অৰ্থাৎ shown.bs.tooltipবা hidden.bs.tooltipইভেন্ট ঘটাৰ আগতে) কলাৰলৈ উভতি যায়। ইয়াক টুলটিপৰ “মেনুৱেল” ট্ৰিগাৰিং বুলি গণ্য কৰা হয়।

$('#element').tooltip('toggle')

.tooltip('dispose')

এটা উপাদানৰ সঁজুলি টিপ লুকুৱাই ৰাখে আৰু ধ্বংস কৰে। ডেলিগেচন ব্যৱহাৰ কৰা সঁজুলিটিপসমূহ (যিবোৰ বিকল্প ব্যৱহাৰ কৰিselector সৃষ্টি কৰা হয় ) বংশধৰ ট্ৰিগাৰ উপাদানসমূহত পৃথকে পৃথকে ধ্বংস কৰিব নোৱাৰি।

$('#element').tooltip('dispose')

.tooltip('enable')

এটা উপাদানৰ সঁজুলিটিপক দেখুৱাব পৰা ক্ষমতা দিয়ে। সঁজুলি টিপসমূহ অবিকল্পিতভাৱে সামৰ্থবান কৰা হৈছে।

$('#element').tooltip('enable')

.tooltip('disable')

এটা উপাদানৰ সঁজুলিটিপ দেখুৱাবলগীয়া ক্ষমতা আঁতৰায়। সঁজুলিটিপটো পুনৰ সামৰ্থবান কৰিলেহে দেখুৱাব পাৰিব।

$('#element').tooltip('disable')

.tooltip('toggleEnabled')

এটা উপাদানৰ সঁজুলিটিপ দেখুৱা বা লুকুৱাব পৰা ক্ষমতা টগল কৰে।

$('#element').tooltip('toggleEnabled')

.tooltip('update')

এটা উপাদানৰ সঁজুলিটিপৰ অৱস্থান আপডেইট কৰে।

$('#element').tooltip('update')

ইভেন্টসমূহ

ইভেন্টৰ ধৰণ বিৱৰণ
শ্ব'.বি.এছ.টুলটিপ এই ইভেন্ট তৎক্ষণাত ফায়াৰ হয় যেতিয়া showইনষ্টেন্স পদ্ধতি কল কৰা হয়।
shown.bs.টুলটিপ এই ইভেন্টটো গুলিয়াই দিয়া হয় যেতিয়া সঁজুলিটিপ ব্যৱহাৰকাৰীৰ বাবে দৃশ্যমান কৰা হয় (CSS পৰিৱৰ্তনসমূহ সম্পূৰ্ণ হোৱালৈ অপেক্ষা কৰিব)।
hide.bs.টুলটিপ এই ইভেন্ট তৎক্ষণাত ফায়াৰ কৰা হয় যেতিয়া hideইনষ্টেন্স পদ্ধতি কল কৰা হয়।
hidden.bs.টুলটিপ এই ইভেন্টটো গুলিয়াই দিয়া হয় যেতিয়া সঁজুলিটিপ ব্যৱহাৰকাৰীৰ পৰা লুকুৱাই ৰখা শেষ হয় (CSS পৰিবৰ্তনসমূহ সম্পূৰ্ণ হ'বলৈ অপেক্ষা কৰিব)।
সন্নিৱিষ্ট কৰা হৈছে.bs.tooltip এই ইভেন্টক ইভেন্টৰ পিছত ফায়াৰ কৰা হয় show.bs.tooltipযেতিয়া সঁজুলিটিপ সাঁচ DOM ত যোগ কৰা হয়। 
$('#myTooltip').on('hidden.bs.tooltip', function () {
  // do something…
})