ಪಾಪೋವರ್ಸ್

ನಿಮ್ಮ ಸೈಟ್‌ನಲ್ಲಿನ ಯಾವುದೇ ಅಂಶಕ್ಕೆ iOS ನಲ್ಲಿ ಕಂಡುಬರುವಂತೆ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಪಾಪೋವರ್‌ಗಳನ್ನು ಸೇರಿಸಲು ದಾಖಲೆ ಮತ್ತು ಉದಾಹರಣೆಗಳು.

ಅವಲೋಕನ

ಪಾಪೋವರ್ ಪ್ಲಗಿನ್ ಬಳಸುವಾಗ ತಿಳಿದುಕೊಳ್ಳಬೇಕಾದ ವಿಷಯಗಳು:

Popovers ಸ್ಥಾನೀಕರಣಕ್ಕಾಗಿ 3ನೇ ಪಕ್ಷದ ಲೈಬ್ರರಿ Popper.js ಅನ್ನು ಅವಲಂಬಿಸಿವೆ . ನೀವು bootstrap.js ಮೊದಲು popper.min.jsbootstrap.bundle.min.js ಅನ್ನು ಸೇರಿಸಬೇಕು ಅಥವಾ popovers ಕೆಲಸ ಮಾಡಲು Popper.js ಅನ್ನು ಒಳಗೊಂಡಿರುವ / bootstrap.bundle.jsಅನ್ನು ಬಳಸಬೇಕು!
ಪಾಪೋವರ್‌ಗಳಿಗೆ ಟೂಲ್‌ಟಿಪ್ ಪ್ಲಗಿನ್ ಅವಲಂಬನೆಯಾಗಿ ಅಗತ್ಯವಿದೆ.
ನೀವು ಮೂಲದಿಂದ ನಮ್ಮ JavaScript ಅನ್ನು ನಿರ್ಮಿಸುತ್ತಿದ್ದರೆ, ಅದಕ್ಕೆ ಅಗತ್ಯವಿದೆutil.js .
ಕಾರ್ಯಕ್ಷಮತೆಯ ಕಾರಣಗಳಿಗಾಗಿ Popovers ಆಯ್ಕೆಯಾಗಿದೆ, ಆದ್ದರಿಂದ ನೀವು ಅವುಗಳನ್ನು ನೀವೇ ಪ್ರಾರಂಭಿಸಬೇಕು .
ಶೂನ್ಯ-ಉದ್ದ titleಮತ್ತು contentಮೌಲ್ಯಗಳು ಎಂದಿಗೂ ಪಾಪೋವರ್ ಅನ್ನು ತೋರಿಸುವುದಿಲ್ಲ.
container: 'body'ಹೆಚ್ಚು ಸಂಕೀರ್ಣ ಘಟಕಗಳಲ್ಲಿ (ನಮ್ಮ ಇನ್‌ಪುಟ್ ಗುಂಪುಗಳು, ಬಟನ್ ಗುಂಪುಗಳು, ಇತ್ಯಾದಿ) ರೆಂಡರಿಂಗ್ ಸಮಸ್ಯೆಗಳನ್ನು ತಪ್ಪಿಸಲು ನಿರ್ದಿಷ್ಟಪಡಿಸಿ .
ಗುಪ್ತ ಅಂಶಗಳ ಮೇಲೆ ಪಾಪೋವರ್‌ಗಳನ್ನು ಪ್ರಚೋದಿಸುವುದು ಕೆಲಸ ಮಾಡುವುದಿಲ್ಲ.
ಪೊಪೊವರ್‌ಗಳು .disabledಅಥವಾ disabledಎಲಿಮೆಂಟ್‌ಗಳನ್ನು ರ್ಯಾಪರ್ ಅಂಶದ ಮೇಲೆ ಪ್ರಚೋದಿಸಬೇಕು.
ಬಹು ಸಾಲುಗಳಲ್ಲಿ ಸುತ್ತುವ ಆಂಕರ್‌ಗಳಿಂದ ಪ್ರಚೋದಿಸಿದಾಗ, ಆಂಕರ್‌ಗಳ ಒಟ್ಟಾರೆ ಅಗಲದ ನಡುವೆ ಪಾಪೋವರ್‌ಗಳು ಕೇಂದ್ರೀಕೃತವಾಗಿರುತ್ತವೆ. ಈ ನಡವಳಿಕೆಯನ್ನು ತಪ್ಪಿಸಲು white-space: nowrap;ನಿಮ್ಮ s ನಲ್ಲಿ ಬಳಸಿ .<a>
DOM ನಿಂದ ಅವುಗಳ ಅನುಗುಣವಾದ ಅಂಶಗಳನ್ನು ತೆಗೆದುಹಾಕುವ ಮೊದಲು ಪಾಪೋವರ್‌ಗಳನ್ನು ಮರೆಮಾಡಬೇಕು.

ಕೆಲವು ಉದಾಹರಣೆಗಳೊಂದಿಗೆ ಪಾಪೋವರ್ಸ್ ಹೇಗೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ನೋಡಲು ಓದುವುದನ್ನು ಮುಂದುವರಿಸಿ.

ಉದಾಹರಣೆ: ಎಲ್ಲೆಡೆ ಪಾಪೋವರ್‌ಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಿ

data-toggleಪುಟದಲ್ಲಿ ಎಲ್ಲಾ ಪಾಪೋವರ್‌ಗಳನ್ನು ಪ್ರಾರಂಭಿಸುವ ಒಂದು ಮಾರ್ಗವೆಂದರೆ ಅವುಗಳ ಗುಣಲಕ್ಷಣದ ಮೂಲಕ ಅವುಗಳನ್ನು ಆಯ್ಕೆ ಮಾಡುವುದು :

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

ಉದಾಹರಣೆ: `container`ಆಯ್ಕೆಯನ್ನು ಬಳಸುವುದು

ಪೋಪೋವರ್‌ನೊಂದಿಗೆ ಮಧ್ಯಪ್ರವೇಶಿಸುವಂತಹ ಪೋಷಕ ಅಂಶದಲ್ಲಿ ನೀವು ಕೆಲವು ಶೈಲಿಗಳನ್ನು ಹೊಂದಿರುವಾಗ, ನೀವು ಕಸ್ಟಮ್ ಅನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಬಯಸುತ್ತೀರಿ containerಇದರಿಂದ ಪಾಪೋವರ್‌ನ HTML ಆ ಅಂಶದೊಳಗೆ ಗೋಚರಿಸುತ್ತದೆ.

$(function () {
  $('.example-popover').popover({
    container: 'body'
  })
})

ಉದಾಹರಣೆ

<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>

ನಾಲ್ಕು ದಿಕ್ಕುಗಳು

ನಾಲ್ಕು ಆಯ್ಕೆಗಳು ಲಭ್ಯವಿದೆ: ಮೇಲಿನ, ಬಲ, ಕೆಳಗೆ ಮತ್ತು ಎಡಕ್ಕೆ ಜೋಡಿಸಲಾಗಿದೆ.

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on top
</button>

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on right
</button>

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus
sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on bottom
</button>

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on left
</button>

ಮುಂದಿನ ಕ್ಲಿಕ್‌ನಲ್ಲಿ ವಜಾಗೊಳಿಸಿ

focusಟಾಗಲ್ ಅಂಶಕ್ಕಿಂತ ವಿಭಿನ್ನ ಅಂಶದ ಬಳಕೆದಾರರ ಮುಂದಿನ ಕ್ಲಿಕ್‌ನಲ್ಲಿ ಪಾಪೋವರ್‌ಗಳನ್ನು ವಜಾಗೊಳಿಸಲು ಪ್ರಚೋದಕವನ್ನು ಬಳಸಿ .

ಮುಂದಿನ ಕ್ಲಿಕ್‌ನಲ್ಲಿ ವಜಾಗೊಳಿಸಲು ನಿರ್ದಿಷ್ಟ ಮಾರ್ಕ್‌ಅಪ್ ಅಗತ್ಯವಿದೆ

<a>ಸರಿಯಾದ ಕ್ರಾಸ್-ಬ್ರೌಸರ್ ಮತ್ತು ಕ್ರಾಸ್-ಪ್ಲಾಟ್‌ಫಾರ್ಮ್ ನಡವಳಿಕೆಗಾಗಿ, ನೀವು ಟ್ಯಾಗ್ ಅನ್ನು ಬಳಸಬೇಕು, ಟ್ಯಾಗ್ ಅಲ್ಲ , ಮತ್ತು ನೀವು ಗುಣಲಕ್ಷಣವನ್ನು <button>ಸಹ ಸೇರಿಸಬೇಕು .tabindex

ವಜಾಗೊಳಿಸಬಹುದಾದ ಪಾಪೋವರ್

<a tabindex="0" class="btn btn-lg btn-danger" role="button" data-toggle="popover" data-trigger="focus" title="Dismissible popover" data-content="And here's some amazing content. It's very engaging. Right?">Dismissible popover</a>

$('.popover-dismiss').popover({
  trigger: 'focus'
})

ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಿದ ಅಂಶಗಳು

ಗುಣಲಕ್ಷಣವನ್ನು ಹೊಂದಿರುವ ಅಂಶಗಳು disabledಸಂವಾದಾತ್ಮಕವಾಗಿರುವುದಿಲ್ಲ, ಅಂದರೆ ಬಳಕೆದಾರರು ಪಾಪೋವರ್ (ಅಥವಾ ಟೂಲ್‌ಟಿಪ್) ಅನ್ನು ಪ್ರಚೋದಿಸಲು ಅವುಗಳನ್ನು ಸುಳಿದಾಡಲು ಅಥವಾ ಕ್ಲಿಕ್ ಮಾಡಲು ಸಾಧ್ಯವಿಲ್ಲ. ಪರಿಹಾರವಾಗಿ, ನೀವು ಹೊದಿಕೆಯಿಂದ ಪಾಪೋವರ್ ಅನ್ನು ಪ್ರಚೋದಿಸಲು <div>ಅಥವಾ ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಲಾದ ಅಂಶವನ್ನು <span>ಅತಿಕ್ರಮಿಸಲು ಬಯಸುತ್ತೀರಿ.pointer-events

ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಲಾದ ಪಾಪ್‌ಓವರ್ ಟ್ರಿಗ್ಗರ್‌ಗಳಿಗಾಗಿ, ನಿಮ್ಮ ಬಳಕೆದಾರರಿಗೆ ಪಾಪ್‌ಓವರ್ ತಕ್ಷಣದ ದೃಶ್ಯ ಪ್ರತಿಕ್ರಿಯೆಯಾಗಿ ಕಾಣಿಸಿಕೊಳ್ಳಲು ನೀವು ಆದ್ಯತೆ ನೀಡಬಹುದು data-trigger="hover"ಏಕೆಂದರೆ ಅವರು ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಲಾದ ಅಂಶವನ್ನು ಕ್ಲಿಕ್ ಮಾಡಲು ನಿರೀಕ್ಷಿಸುವುದಿಲ್ಲ.

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

ಬಳಕೆ

JavaScript ಮೂಲಕ popovers ಸಕ್ರಿಯಗೊಳಿಸಿ:

$('#example').popover(options)

ಆಯ್ಕೆಗಳು

ಡೇಟಾ ಗುಣಲಕ್ಷಣಗಳು ಅಥವಾ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಮೂಲಕ ಆಯ್ಕೆಗಳನ್ನು ರವಾನಿಸಬಹುದು. ಡೇಟಾ ಗುಣಲಕ್ಷಣಗಳಿಗಾಗಿ, ಆಯ್ಕೆಯ ಹೆಸರನ್ನು ಸೇರಿಸಿ data-, data-animation="".

ಹೆಸರು	ಮಾದರಿ	ಡೀಫಾಲ್ಟ್	ವಿವರಣೆ
ಅನಿಮೇಷನ್	ಬೂಲಿಯನ್	ನಿಜ	ಪಾಪೋವರ್‌ಗೆ CSS ಫೇಡ್ ಪರಿವರ್ತನೆಯನ್ನು ಅನ್ವಯಿಸಿ
ಕಂಟೇನರ್	ದಾರ \| ಅಂಶ \| ಸುಳ್ಳು	ಸುಳ್ಳು	ನಿರ್ದಿಷ್ಟ ಅಂಶಕ್ಕೆ ಪಾಪೋವರ್ ಅನ್ನು ಸೇರಿಸುತ್ತದೆ. ಉದಾಹರಣೆ: `container: 'body'`. ಈ ಆಯ್ಕೆಯು ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿದ್ದು, ಡಾಕ್ಯುಮೆಂಟ್‌ನ ಹರಿವಿನಲ್ಲಿ ಪ್ರಚೋದಕ ಅಂಶದ ಬಳಿ ಪಾಪೋವರ್ ಅನ್ನು ಇರಿಸಲು ನಿಮಗೆ ಅವಕಾಶ ನೀಡುತ್ತದೆ - ಇದು ವಿಂಡೋ ಮರುಗಾತ್ರದ ಸಮಯದಲ್ಲಿ ಪ್ರಚೋದಕ ಅಂಶದಿಂದ ದೂರ ತೇಲುವುದನ್ನು ತಡೆಯುತ್ತದೆ.
ವಿಷಯ	ದಾರ \| ಅಂಶ \| ಕಾರ್ಯ	''	`data-content`ಗುಣಲಕ್ಷಣವು ಇಲ್ಲದಿದ್ದರೆ ಡಿಫಾಲ್ಟ್ ವಿಷಯ ಮೌಲ್ಯ . ಒಂದು ಕಾರ್ಯವನ್ನು ನೀಡಿದರೆ, `this`ಪಾಪೋವರ್ ಲಗತ್ತಿಸಲಾದ ಅಂಶಕ್ಕೆ ಅದರ ಉಲ್ಲೇಖದೊಂದಿಗೆ ಅದನ್ನು ಕರೆಯಲಾಗುತ್ತದೆ.
ವಿಳಂಬ	ಸಂಖ್ಯೆ \| ವಸ್ತು	0	popover (ms) ಅನ್ನು ತೋರಿಸಲು ಮತ್ತು ಮರೆಮಾಡಲು ವಿಳಂಬ - ಹಸ್ತಚಾಲಿತ ಪ್ರಚೋದಕ ಪ್ರಕಾರಕ್ಕೆ ಅನ್ವಯಿಸುವುದಿಲ್ಲ ಸಂಖ್ಯೆಯನ್ನು ಒದಗಿಸಿದರೆ, ಮರೆಮಾಡು/ತೋರಿಕೆ ಎರಡಕ್ಕೂ ವಿಳಂಬವನ್ನು ಅನ್ವಯಿಸಲಾಗುತ್ತದೆ ವಸ್ತುವಿನ ರಚನೆ ಹೀಗಿದೆ:`delay: { "show": 500, "hide": 100 }`
html	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ಪಾಪೋವರ್‌ಗೆ HTML ಅನ್ನು ಸೇರಿಸಿ. ತಪ್ಪಾಗಿದ್ದರೆ, `text`DOM ಗೆ ವಿಷಯವನ್ನು ಸೇರಿಸಲು jQuery ನ ವಿಧಾನವನ್ನು ಬಳಸಲಾಗುತ್ತದೆ. ನೀವು XSS ದಾಳಿಗಳ ಬಗ್ಗೆ ಚಿಂತೆ ಮಾಡುತ್ತಿದ್ದರೆ ಪಠ್ಯವನ್ನು ಬಳಸಿ.
ನಿಯೋಜನೆ	ದಾರ \| ಕಾರ್ಯ	'ಬಲ'	ಪಾಪೋವರ್ ಅನ್ನು ಹೇಗೆ ಇರಿಸುವುದು - ಸ್ವಯಂ \| ಮೇಲ್ಭಾಗ \| ಕೆಳಗೆ \| ಬಿಟ್ಟು \| ಬಲ. ನಿರ್ದಿಷ್ಟಪಡಿಸಿದಾಗ, ಇದು ಪಾಪೋವರ್ ಅನ್ನು ಕ್ರಿಯಾತ್ಮಕವಾಗಿ ಮರುಹೊಂದಿಸುತ್ತದೆ .`auto` ನಿಯೋಜನೆಯನ್ನು ನಿರ್ಧರಿಸಲು ಫಂಕ್ಷನ್ ಅನ್ನು ಬಳಸಿದಾಗ, ಅದನ್ನು ಪಾಪೋವರ್ DOM ನೋಡ್ ಅನ್ನು ಅದರ ಮೊದಲ ಆರ್ಗ್ಯುಮೆಂಟ್ ಎಂದು ಕರೆಯಲಾಗುತ್ತದೆ ಮತ್ತು ಪ್ರಚೋದಿಸುವ ಅಂಶ DOM ನೋಡ್ ಅನ್ನು ಅದರ ಎರಡನೆಯದಾಗಿ ಕರೆಯಲಾಗುತ್ತದೆ. ಸಂದರ್ಭವನ್ನು ಪಾಪೋವರ್ `this`ನಿದರ್ಶನಕ್ಕೆ ಹೊಂದಿಸಲಾಗಿದೆ.
ಆಯ್ಕೆಗಾರ	ದಾರ \| ಸುಳ್ಳು	ಸುಳ್ಳು	ಸೆಲೆಕ್ಟರ್ ಅನ್ನು ಒದಗಿಸಿದರೆ, ನಿರ್ದಿಷ್ಟ ಗುರಿಗಳಿಗೆ ಪಾಪೋವರ್ ಆಬ್ಜೆಕ್ಟ್‌ಗಳನ್ನು ನಿಯೋಜಿಸಲಾಗುತ್ತದೆ. ಪ್ರಾಯೋಗಿಕವಾಗಿ, ಪಾಪೋವರ್‌ಗಳನ್ನು ಸೇರಿಸಲು ಡೈನಾಮಿಕ್ HTML ವಿಷಯವನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲು ಇದನ್ನು ಬಳಸಲಾಗುತ್ತದೆ. ಇದನ್ನು ಮತ್ತು ಮಾಹಿತಿಯುಕ್ತ ಉದಾಹರಣೆಯನ್ನು ನೋಡಿ .
ಟೆಂಪ್ಲೇಟ್	ಸ್ಟ್ರಿಂಗ್	`'<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>'`	ಪಾಪೋವರ್ ಅನ್ನು ರಚಿಸುವಾಗ ಬಳಸಲು ಬೇಸ್ HTML. ಪಾಪೋವರ್ `title`ಅನ್ನು ಚುಚ್ಚಲಾಗುತ್ತದೆ `.popover-header`. ಪಾಪೋವರ್ `content`ಅನ್ನು ಚುಚ್ಚಲಾಗುತ್ತದೆ `.popover-body`. `.arrow`ಪಾಪೋವರ್‌ನ ಬಾಣವಾಗುತ್ತದೆ. ಹೊರಗಿನ ಹೊದಿಕೆ ಅಂಶವು `.popover`ವರ್ಗವನ್ನು ಹೊಂದಿರಬೇಕು.
ಶೀರ್ಷಿಕೆ	ದಾರ \| ಅಂಶ \| ಕಾರ್ಯ	''	`title`ಗುಣಲಕ್ಷಣವು ಇಲ್ಲದಿದ್ದರೆ ಡೀಫಾಲ್ಟ್ ಶೀರ್ಷಿಕೆ ಮೌಲ್ಯ . ಒಂದು ಕಾರ್ಯವನ್ನು ನೀಡಿದರೆ, `this`ಪಾಪೋವರ್ ಲಗತ್ತಿಸಲಾದ ಅಂಶಕ್ಕೆ ಅದರ ಉಲ್ಲೇಖದೊಂದಿಗೆ ಅದನ್ನು ಕರೆಯಲಾಗುತ್ತದೆ.
ಪ್ರಚೋದಕ	ಸ್ಟ್ರಿಂಗ್	'ಕ್ಲಿಕ್'	ಪಾಪೋವರ್ ಅನ್ನು ಹೇಗೆ ಪ್ರಚೋದಿಸಲಾಗುತ್ತದೆ - ಕ್ಲಿಕ್ ಮಾಡಿ \| ಸುಳಿದಾಡಿ \| ಗಮನ \| ಕೈಪಿಡಿ. ನೀವು ಬಹು ಪ್ರಚೋದಕಗಳನ್ನು ರವಾನಿಸಬಹುದು; ಅವುಗಳನ್ನು ಜಾಗದಿಂದ ಪ್ರತ್ಯೇಕಿಸಿ. `ಕೈಪಿಡಿ` ಅನ್ನು ಬೇರೆ ಯಾವುದೇ ಪ್ರಚೋದಕದೊಂದಿಗೆ ಸಂಯೋಜಿಸಲಾಗುವುದಿಲ್ಲ.
ಆಫ್ಸೆಟ್	ಸಂಖ್ಯೆ \| ಸ್ಟ್ರಿಂಗ್	0	ಅದರ ಗುರಿಗೆ ಸಂಬಂಧಿಸಿದಂತೆ ಪಾಪೋವರ್‌ನ ಆಫ್‌ಸೆಟ್. ಹೆಚ್ಚಿನ ಮಾಹಿತಿಗಾಗಿ Popper.js ನ ಆಫ್‌ಸೆಟ್ ಡಾಕ್ಸ್ ಅನ್ನು ನೋಡಿ .
ಫಾಲ್ಬ್ಯಾಕ್ ಪ್ಲೇಸ್ಮೆಂಟ್	ದಾರ \| ಶ್ರೇಣಿ	'ಫ್ಲಿಪ್'	ಫಾಲ್‌ಬ್ಯಾಕ್‌ನಲ್ಲಿ ಪಾಪ್ಪರ್ ಯಾವ ಸ್ಥಾನವನ್ನು ಬಳಸುತ್ತಾರೆ ಎಂಬುದನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಅನುಮತಿಸಿ. ಹೆಚ್ಚಿನ ಮಾಹಿತಿಗಾಗಿ Popper.js ನ ನಡವಳಿಕೆ ಡಾಕ್ಸ್ ಅನ್ನು ನೋಡಿ
ಗಡಿ	ದಾರ \| ಅಂಶ	'ಸ್ಕ್ರೋಲ್ ಪೇರೆಂಟ್'	ಪಾಪೋವರ್‌ನ ಓವರ್‌ಫ್ಲೋ ನಿರ್ಬಂಧದ ಗಡಿ. `'viewport'`, `'window'`, `'scrollParent'`, ಅಥವಾ HTML ಎಲಿಮೆಂಟ್ ಉಲ್ಲೇಖದ ಮೌಲ್ಯಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತದೆ (ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಮಾತ್ರ). ಹೆಚ್ಚಿನ ಮಾಹಿತಿಗಾಗಿ Popper.js ನ ತಡೆಗಟ್ಟುವ ಓವರ್‌ಫ್ಲೋ ಡಾಕ್ಸ್ ಅನ್ನು ನೋಡಿ .

ವೈಯಕ್ತಿಕ ಪಾಪೋವರ್‌ಗಳಿಗಾಗಿ ಡೇಟಾ ಗುಣಲಕ್ಷಣಗಳು

ಮೇಲೆ ವಿವರಿಸಿದಂತೆ ಡೇಟಾ ಗುಣಲಕ್ಷಣಗಳ ಬಳಕೆಯ ಮೂಲಕ ವೈಯಕ್ತಿಕ ಪಾಪೋವರ್‌ಗಳ ಆಯ್ಕೆಗಳನ್ನು ಪರ್ಯಾಯವಾಗಿ ನಿರ್ದಿಷ್ಟಪಡಿಸಬಹುದು.

ವಿಧಾನಗಳು

ಅಸಮಕಾಲಿಕ ವಿಧಾನಗಳು ಮತ್ತು ಪರಿವರ್ತನೆಗಳು

ಎಲ್ಲಾ API ವಿಧಾನಗಳು ಅಸಮಕಾಲಿಕವಾಗಿರುತ್ತವೆ ಮತ್ತು ಪರಿವರ್ತನೆಯನ್ನು ಪ್ರಾರಂಭಿಸುತ್ತವೆ . ಪರಿವರ್ತನೆ ಪ್ರಾರಂಭವಾದ ತಕ್ಷಣ ಅವರು ಕರೆ ಮಾಡುವವರ ಬಳಿಗೆ ಹಿಂತಿರುಗುತ್ತಾರೆ ಆದರೆ ಅದು ಮುಗಿಯುವ ಮೊದಲು . ಹೆಚ್ಚುವರಿಯಾಗಿ, ಪರಿವರ್ತನೆಯ ಘಟಕದಲ್ಲಿನ ವಿಧಾನದ ಕರೆಯನ್ನು ನಿರ್ಲಕ್ಷಿಸಲಾಗುತ್ತದೆ .

ಹೆಚ್ಚಿನ ಮಾಹಿತಿಗಾಗಿ ನಮ್ಮ JavaScript ದಸ್ತಾವೇಜನ್ನು ನೋಡಿ.

`$().popover(options)`

ಅಂಶ ಸಂಗ್ರಹಕ್ಕಾಗಿ ಪಾಪೋವರ್‌ಗಳನ್ನು ಪ್ರಾರಂಭಿಸುತ್ತದೆ.

`.popover('show')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ಬಹಿರಂಗಪಡಿಸುತ್ತದೆ. ಪಾಪೋವರ್ ಅನ್ನು ನಿಜವಾಗಿ ತೋರಿಸುವ ಮೊದಲು (ಅಂದರೆ shown.bs.popoverಈವೆಂಟ್ ಸಂಭವಿಸುವ ಮೊದಲು) ಕರೆ ಮಾಡಿದವರಿಗೆ ಹಿಂತಿರುಗುತ್ತದೆ. ಇದನ್ನು ಪಾಪೋವರ್‌ನ "ಕೈಪಿಡಿ" ಪ್ರಚೋದನೆ ಎಂದು ಪರಿಗಣಿಸಲಾಗುತ್ತದೆ. ಶೀರ್ಷಿಕೆ ಮತ್ತು ವಿಷಯಗಳೆರಡೂ ಶೂನ್ಯ-ಉದ್ದವನ್ನು ಹೊಂದಿರುವ ಪಾಪೋವರ್‌ಗಳನ್ನು ಎಂದಿಗೂ ಪ್ರದರ್ಶಿಸಲಾಗುವುದಿಲ್ಲ.

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

`.popover('hide')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ಮರೆಮಾಡುತ್ತದೆ. ಪಾಪೋವರ್ ಅನ್ನು ವಾಸ್ತವವಾಗಿ ಮರೆಮಾಡುವ ಮೊದಲು (ಅಂದರೆ hidden.bs.popoverಈವೆಂಟ್ ಸಂಭವಿಸುವ ಮೊದಲು) ಕರೆ ಮಾಡಿದವರಿಗೆ ಹಿಂತಿರುಗುತ್ತದೆ. ಇದನ್ನು ಪಾಪೋವರ್‌ನ "ಕೈಪಿಡಿ" ಪ್ರಚೋದನೆ ಎಂದು ಪರಿಗಣಿಸಲಾಗುತ್ತದೆ.

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

`.popover('toggle')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ಟಾಗಲ್ ಮಾಡುತ್ತದೆ. ಪಾಪೋವರ್ ಅನ್ನು ನಿಜವಾಗಿ ತೋರಿಸುವ ಅಥವಾ ಮರೆಮಾಡುವ ಮೊದಲು (ಅಂದರೆ shown.bs.popoverಅಥವಾ hidden.bs.popoverಈವೆಂಟ್ ಸಂಭವಿಸುವ ಮೊದಲು) ಕರೆ ಮಾಡಿದವರಿಗೆ ಹಿಂತಿರುಗುತ್ತದೆ. ಇದನ್ನು ಪಾಪೋವರ್‌ನ "ಕೈಪಿಡಿ" ಪ್ರಚೋದನೆ ಎಂದು ಪರಿಗಣಿಸಲಾಗುತ್ತದೆ.

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

`.popover('dispose')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ಮರೆಮಾಡುತ್ತದೆ ಮತ್ತು ನಾಶಪಡಿಸುತ್ತದೆ. ನಿಯೋಗವನ್ನು ಬಳಸುವ ಪಾಪೋವರ್‌ಗಳನ್ನು ( ಆಯ್ಕೆಯನ್ನು ಬಳಸಿಕೊಂಡು ರಚಿಸಲಾಗಿದೆ )selector ವಂಶಸ್ಥ ಪ್ರಚೋದಕ ಅಂಶಗಳ ಮೇಲೆ ಪ್ರತ್ಯೇಕವಾಗಿ ನಾಶಪಡಿಸಲಾಗುವುದಿಲ್ಲ.

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

`.popover('enable')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ತೋರಿಸಲು ಸಾಮರ್ಥ್ಯವನ್ನು ನೀಡುತ್ತದೆ. Popovers ಡೀಫಾಲ್ಟ್ ಆಗಿ ಸಕ್ರಿಯಗೊಳಿಸಲಾಗಿದೆ.

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

`.popover('disable')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ತೋರಿಸಲು ಸಾಮರ್ಥ್ಯವನ್ನು ತೆಗೆದುಹಾಕುತ್ತದೆ. ಅದನ್ನು ಮರು-ಸಕ್ರಿಯಗೊಳಿಸಿದರೆ ಮಾತ್ರ ಪಾಪೋವರ್ ಅನ್ನು ತೋರಿಸಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ.

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

`.popover('toggleEnabled')`

ಅಂಶದ ಪಾಪೋವರ್ ಅನ್ನು ತೋರಿಸಲು ಅಥವಾ ಮರೆಮಾಡಲು ಸಾಮರ್ಥ್ಯವನ್ನು ಟಾಗಲ್ ಮಾಡುತ್ತದೆ.

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

`.popover('update')`

ಅಂಶದ ಪಾಪೋವರ್‌ನ ಸ್ಥಾನವನ್ನು ನವೀಕರಿಸುತ್ತದೆ.

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

ಕಾರ್ಯಕ್ರಮಗಳು

ಈವೆಂಟ್ ಪ್ರಕಾರ	ವಿವರಣೆ
show.bs.popover	`show`ನಿದರ್ಶನ ವಿಧಾನವನ್ನು ಕರೆಯುವಾಗ ಈ ಘಟನೆಯು ತಕ್ಷಣವೇ ಉರಿಯುತ್ತದೆ .
ತೋರಿಸಲಾಗಿದೆ.bs.popover	ಬಳಕೆದಾರರಿಗೆ ಪಾಪೋವರ್ ಗೋಚರಿಸುವಂತೆ ಮಾಡಿದಾಗ ಈ ಈವೆಂಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲಾಗುತ್ತದೆ (CSS ಪರಿವರ್ತನೆಗಳು ಪೂರ್ಣಗೊಳ್ಳಲು ಕಾಯುತ್ತದೆ).
hide.bs.popover	`hide`ನಿದರ್ಶನ ವಿಧಾನವನ್ನು ಕರೆ ಮಾಡಿದಾಗ ಈ ಘಟನೆಯನ್ನು ತಕ್ಷಣವೇ ವಜಾಗೊಳಿಸಲಾಗುತ್ತದೆ .
ಗುಪ್ತ.ಬಿಎಸ್.ಪೋಪೋವರ್	ಬಳಕೆದಾರರಿಂದ ಪಾಪ್ಓವರ್ ಅನ್ನು ಮರೆಮಾಡಿದಾಗ ಈ ಈವೆಂಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲಾಗುತ್ತದೆ (CSS ಪರಿವರ್ತನೆಗಳು ಪೂರ್ಣಗೊಳ್ಳಲು ಕಾಯುತ್ತದೆ).
inserted.bs.popover	`show.bs.popover`DOM ಗೆ ಪಾಪೋವರ್ ಟೆಂಪ್ಲೇಟ್ ಅನ್ನು ಸೇರಿಸಿದಾಗ ಈವೆಂಟ್ ನಂತರ ಈವೆಂಟ್ ಅನ್ನು ತೆಗೆದುಹಾಕಲಾಗುತ್ತದೆ .

$('#myPopover').on('hidden.bs.popover', function () {
  // do something…
})