ನಮ್ಮ ಮೋಡಲ್ ಪ್ಲಗಿನ್ ಸಾಂಪ್ರದಾಯಿಕ ಮೋಡಲ್ ಜೆಎಸ್ ಪ್ಲಗಿನ್‌ನಲ್ಲಿ ಸೂಪರ್ ಸ್ಲಿಮ್ ಟೇಕ್ ಆಗಿದೆ, ಟ್ವಿಟರ್‌ನಲ್ಲಿ ನಮಗೆ ಅಗತ್ಯವಿರುವ ಬೇರ್ ಕಾರ್ಯವನ್ನು ಮಾತ್ರ ಸೇರಿಸಲು ವಿಶೇಷ ಕಾಳಜಿಯನ್ನು ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ.

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್-ಮೋಡಲ್ ಅನ್ನು ಬಳಸುವುದು

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ( ಆಯ್ಕೆಗಳು )

ಆಯ್ಕೆಗಳು

ಹೆಸರು	ಮಾದರಿ	ಪೂರ್ವನಿಯೋಜಿತ	ವಿವರಣೆ
ಹಿನ್ನೆಲೆ	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ಮಾದರಿ-ಬ್ಯಾಕ್‌ಡ್ರಾಪ್ ಅಂಶವನ್ನು ಒಳಗೊಂಡಿದೆ
ಕೀಬೋರ್ಡ್	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ಎಸ್ಕೇಪ್ ಕೀಲಿಯನ್ನು ಒತ್ತಿದಾಗ ಮೋಡಲ್ ಅನ್ನು ಮುಚ್ಚುತ್ತದೆ
ತೋರಿಸು	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ವರ್ಗ ಪ್ರಾರಂಭದಲ್ಲಿ ಮಾದರಿಯನ್ನು ತೆರೆಯುತ್ತದೆ

ಮಾರ್ಕ್ಅಪ್

ಒಂದೇ ಸಾಲಿನ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಬರೆಯದೆಯೇ ನಿಮ್ಮ ಪುಟದಲ್ಲಿ ನೀವು ಸುಲಭವಾಗಿ ಮಾದರಿಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಬಹುದು. ಒಂದು ಅಂಶಕ್ಕೆ data-controls-modalಮಾದರಿ ಅಂಶ ಐಡಿಗೆ ಅನುಗುಣವಾದ ಗುಣಲಕ್ಷಣವನ್ನು ನೀಡಿ ಮತ್ತು ಕ್ಲಿಕ್ ಮಾಡಿದಾಗ, ಅದು ನಿಮ್ಮ ಮಾದರಿಯನ್ನು ಪ್ರಾರಂಭಿಸುತ್ತದೆ. ಮಾದರಿ ಆಯ್ಕೆಗಳನ್ನು ಸೇರಿಸಲು, ಅವುಗಳನ್ನು ಡೇಟಾ ಗುಣಲಕ್ಷಣಗಳಾಗಿ ಸೇರಿಸಿ.

<a class = "btn" data-controls-modal = "my-modal" data-backdrop = "true" > ಲಾಂಚ್ ಮಾಡಲ್ </a>    

ಗಮನಿಸಿ ನಿಮ್ಮ ಮಾದರಿಯನ್ನು ಒಳಗೆ ಮತ್ತು ಹೊರಗೆ ಅನಿಮೇಟ್ ಮಾಡಲು ನೀವು ಬಯಸಿದರೆ, .fadeನಿಮ್ಮ ಅಂಶಕ್ಕೆ ವರ್ಗವನ್ನು ಸೇರಿಸಿ .modal(ಇದನ್ನು ಕ್ರಿಯೆಯಲ್ಲಿ ನೋಡಲು ಡೆಮೊವನ್ನು ನೋಡಿ).

ವಿಧಾನಗಳು

.modal(ಆಯ್ಕೆಗಳು)

ನಿಮ್ಮ ವಿಷಯವನ್ನು ಮಾದರಿಯಾಗಿ ಸಕ್ರಿಯಗೊಳಿಸುತ್ತದೆ. ಐಚ್ಛಿಕ ಆಯ್ಕೆಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತದೆ object.

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ({
  closeOnEscape : ನಿಜ 
})

.modal('ಟಾಗಲ್')

ಒಂದು ಮೋಡಲ್ ಅನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ಟಾಗಲ್ ಮಾಡುತ್ತದೆ.

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ( 'ಟಾಗಲ್' )

.modal('ಶೋ')

ಹಸ್ತಚಾಲಿತವಾಗಿ ಒಂದು ಮಾದರಿಯನ್ನು ತೆರೆಯುತ್ತದೆ.

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ( 'ಶೋ' )

.modal('ಮರೆಮಾಡು')

ಒಂದು ಮೋಡಲ್ ಅನ್ನು ಹಸ್ತಚಾಲಿತವಾಗಿ ಮರೆಮಾಡುತ್ತದೆ.

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ( 'ಮರೆಮಾಡು' )

.ಮೋಡಲ್(ನಿಜ)

ಎಲಿಮೆಂಟ್ಸ್ ಮಾದರಿ ವರ್ಗದ ನಿದರ್ಶನವನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ.

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಮಾದರಿ ( ನಿಜ )

ಪರ್ಯಾಯವಾಗಿ ಗಮನಿಸಿ$().data('modal') , ಇದನ್ನು ನೊಂದಿಗೆ ಹಿಂಪಡೆಯಬಹುದು .

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

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

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

$ ( '#ಮೈ-ಮೋಡಲ್' ). ಬೈಂಡ್ ( 'ಗುಪ್ತ' , ಕಾರ್ಯ () {   
  //ಏನಾದರೂ ಮಾಡು...
})

ಡೆಮೊ

ಮಾದರಿಯನ್ನು ಪ್ರಾರಂಭಿಸಿ

ಈ ಪ್ಲಗಿನ್ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಟಾಪ್‌ಬಾರ್ ಅಥವಾ ಟ್ಯಾಬ್ಡ್ ನ್ಯಾವಿಗೇಷನ್‌ಗಳಿಗೆ ಡ್ರಾಪ್‌ಡೌನ್ ಪರಸ್ಪರ ಕ್ರಿಯೆಯನ್ನು ಸೇರಿಸುವುದಕ್ಕಾಗಿ ಆಗಿದೆ.

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

boostrap-dropdown.js ಅನ್ನು ಬಳಸುವುದು

$ ( '#ಟಾಪ್ಬಾರ್' ). ಡ್ರಾಪ್‌ಡೌನ್ ()

ಮಾರ್ಕ್ಅಪ್

ಯಾವುದೇ nav ಅಂಶಕ್ಕೆ ಡ್ರಾಪ್‌ಡೌನ್ ಕಾರ್ಯವನ್ನು ತ್ವರಿತವಾಗಿ ಸೇರಿಸಲು, data-dropdownಗುಣಲಕ್ಷಣವನ್ನು ಬಳಸಿ. ಯಾವುದೇ ಮಾನ್ಯ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಡ್ರಾಪ್‌ಡೌನ್ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಸಕ್ರಿಯಗೊಳ್ಳುತ್ತದೆ.

<ul class = "ಟ್ಯಾಬ್‌ಗಳು" > 
  <li class = "ಸಕ್ರಿಯ" ><a href = "#" > ಮುಖಪುಟ </a></li>  
  <li class = "dropdown" data-dropdown = "dropdown" >   
    <a href = "#" class = "dropdown-toggle" > ಡ್ರಾಪ್‌ಡೌನ್ </a>  
    <ul class = "dropdown-menu" > 
      <li><a href = "#" > ಸೆಕೆಂಡರಿ ಲಿಂಕ್ </a></li> 
      <li><a href = "#" > ಇಲ್ಲಿ ಬೇರೆ ಏನೋ </a></li> 
      <li class = "ವಿಭಾಜಕ" ></li> 
      <li><a href = "#" > ಇನ್ನೊಂದು ಲಿಂಕ್ </a></li> 
    </ul>
  </li>
</ul>

ಗಮನಿಸಿ ನಿಮ್ಮ ui ಹಲವಾರು ಡ್ರಾಪ್‌ಡೌನ್‌ಗಳನ್ನು ಹೊಂದಿದ್ದರೆ, data-dropdownಗುಣಲಕ್ಷಣವನ್ನು ಹೆಚ್ಚು ಮಹತ್ವದ ಧಾರಕ ಅಂಶಕ್ಕೆ ಸೇರಿಸುವುದನ್ನು ಪರಿಗಣಿಸಿ .tabsಅಥವಾ .topbar.

ವಿಧಾನಗಳು

$().ಡ್ರಾಪ್‌ಡೌನ್()

ನೀಡಿರುವ ಟಾಪ್‌ಬಾರ್ ಅಥವಾ ಟ್ಯಾಬ್ಡ್ ನ್ಯಾವಿಗೇಶನ್‌ಗಾಗಿ ಮೆನುಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲು ಪ್ರೋಗ್ರಾಮ್ಯಾಟಿಕ್ API.

ಡೆಮೊ

ಈ ಪ್ಲಗಿನ್ ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಟಾಪ್‌ಬಾರ್‌ಗೆ ಸ್ಕ್ರೋಲ್‌ಸ್ಪಿ (ಸ್ವಯಂ ನವೀಕರಣ NAV) ಸಂವಾದವನ್ನು ಸೇರಿಸುವುದಕ್ಕಾಗಿ ಆಗಿದೆ.

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

boostrap-scrollspy.js ಅನ್ನು ಬಳಸುವುದು

$ ( '#ಟಾಪ್ಬಾರ್' ). ಡ್ರಾಪ್‌ಡೌನ್ ()

ಮಾರ್ಕ್ಅಪ್

ನಿಮ್ಮ NAV ಗೆ scrollspy ನಡವಳಿಕೆಯನ್ನು ಸುಲಭವಾಗಿ ಸೇರಿಸಲು, data-scrollspyಗೆ ಗುಣಲಕ್ಷಣವನ್ನು ಸೇರಿಸಿ .topbar.

<div class = "topbar" data-scrollspy = "scrollspy" > ... </div>   

ವಿಧಾನಗಳು

$().scrollspy()

ಬಳಕೆದಾರರ ಸ್ಕ್ರಾಲ್ ಸ್ಥಾನದಿಂದ ಸ್ವಯಂ ನ್ಯಾವಿಗೇಶನ್ ಬಟನ್‌ಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸುತ್ತದೆ.

$ ( 'ದೇಹ > .ಟಾಪ್ಬಾರ್' ). scrollSpy ()

ಟಾಪ್‌ಬಾರ್ ಆಂಕರ್ ಟ್ಯಾಗ್‌ಗಳು ಪರಿಹರಿಸಬಹುದಾದ ಐಡಿ ಗುರಿಗಳನ್ನು ಹೊಂದಿರಬೇಕು ಎಂಬುದನ್ನು ಗಮನಿಸಿ. ಉದಾಹರಣೆಗೆ, <a href="#home">home</a>ಡೊಮ್‌ನಲ್ಲಿರುವ ಯಾವುದನ್ನಾದರೂ ಹೊಂದಿರಬೇಕು <div id="home"></div>.

.scrollspy('refresh')

ಸ್ಕ್ರೋಲ್‌ಸ್ಪಿ ನ್ಯಾವ್ ಬಟನ್‌ಗಳು ಮತ್ತು ಕಾರ್ಯಕ್ಷಮತೆಗಾಗಿ ವಿಭಾಗ ನಿರ್ದೇಶಾಂಕಗಳನ್ನು ಸಂಗ್ರಹಿಸುತ್ತದೆ. ನೀವು ಈ ಸಂಗ್ರಹವನ್ನು ನವೀಕರಿಸಬೇಕಾದರೆ (ನೀವು ಡೈನಾಮಿಕ್ ವಿಷಯವನ್ನು ಹೊಂದಿದ್ದರೆ) ಈ ರಿಫ್ರೆಶ್ ವಿಧಾನವನ್ನು ಕರೆ ಮಾಡಿ. ನಿಮ್ಮ scrollspy ಅನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ನೀವು ಡೇಟಾ ಗುಣಲಕ್ಷಣವನ್ನು ಬಳಸಿದರೆ, ಕೇವಲ ದೇಹಕ್ಕೆ ರಿಫ್ರೆಶ್ ಮಾಡಲು ಕರೆ ಮಾಡಿ.

$ ( 'ದೇಹ' ). scrollspy ( 'ರಿಫ್ರೆಶ್' )

ಡೆಮೊ

ಈ ಪುಟದಲ್ಲಿ ಟಾಪ್‌ಬಾರ್ ನ್ಯಾವಿಗೇಶನ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ.

ಈ ಪ್ಲಗಿನ್ ತ್ವರಿತ, ಡೈನಾಮಿಕ್ ಟ್ಯಾಬ್ ಮತ್ತು ಮಾತ್ರೆ ಕಾರ್ಯವನ್ನು ಸೇರಿಸುತ್ತದೆ.

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

boostrap-tabs.js ಅನ್ನು ಬಳಸುವುದು

$ ( '.tabs' ). ಟ್ಯಾಬ್ಗಳು ()

ಮಾರ್ಕ್ಅಪ್

ನೀವು ಯಾವುದೇ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಬರೆಯದೆಯೇ ಟ್ಯಾಬ್ ಅಥವಾ ಮಾತ್ರೆ ನ್ಯಾವಿಗೇಶನ್ ಅನ್ನು ಸರಳವಾಗಿ data-tabsಅಥವಾ data-pillsಗುಣಲಕ್ಷಣವನ್ನು ನೀಡುವ ಮೂಲಕ ಸಕ್ರಿಯಗೊಳಿಸಬಹುದು.

 <ul class = "tabs" data-tabs = "tabs" > ... </ul>   

ವಿಧಾನಗಳು

$().ಟ್ಯಾಬ್‌ಗಳು ಅಥವಾ $().ಮಾತ್ರೆಗಳು

ಕೊಟ್ಟಿರುವ ಕಂಟೇನರ್‌ಗಾಗಿ ಟ್ಯಾಬ್ ಮತ್ತು ಮಾತ್ರೆ ಕಾರ್ಯವನ್ನು ಸಕ್ರಿಯಗೊಳಿಸುತ್ತದೆ. ಟ್ಯಾಬ್ ಲಿಂಕ್‌ಗಳು ಡಾಕ್ಯುಮೆಂಟ್‌ನಲ್ಲಿ ಐಡಿಗಳನ್ನು ಉಲ್ಲೇಖಿಸಬೇಕು.

<ul class = "ಟ್ಯಾಬ್‌ಗಳು" > 
  <li class = "ಸಕ್ರಿಯ" ><a href = "#ಮನೆ" > ಮುಖಪುಟ </a></li>  
  <li><a href = "#profile" > ಪ್ರೊಫೈಲ್ </a></li> 
  <li><a href = "#messages" > ಸಂದೇಶಗಳು </a></li> 
  <li><a href = "#settings" > ಸೆಟ್ಟಿಂಗ್‌ಗಳು </a></li> 
</ul>
 
<div ವರ್ಗ = "ಮಾತ್ರೆ-ವಿಷಯ" > 
  <div class = "ಸಕ್ರಿಯ" id = "ಮನೆ" > ... </div>  
  <div id = "ಪ್ರೊಫೈಲ್" > ... </div> 
  <div id = "ಸಂದೇಶಗಳು" > ... </div> 
  <div id = "settings" > ... </div> 
</ul>
 
<ಸ್ಕ್ರಿಪ್ಟ್>
  $ ( ಕಾರ್ಯ () {  
    $ ( '.tabs' ). ಟ್ಯಾಬ್ಗಳು ()
  })
</script>

ಡೆಮೊ

• ಮುಖಪುಟ
• ಪ್ರೊಫೈಲ್
• ಸಂದೇಶಗಳು
• ಸಂಯೋಜನೆಗಳು

ಜೇಸನ್ ಫ್ರೇಮ್ ಬರೆದ ಅತ್ಯುತ್ತಮ jQuery.tipsy ಪ್ಲಗಿನ್ ಆಧರಿಸಿ; twipsy ಒಂದು ನವೀಕರಿಸಿದ ಆವೃತ್ತಿಯಾಗಿದೆ, ಇದು ಚಿತ್ರಗಳ ಮೇಲೆ ಅವಲಂಬಿತವಾಗಿಲ್ಲ, ಅನಿಮೇಷನ್‌ಗಳಿಗಾಗಿ css3 ಮತ್ತು ಶೀರ್ಷಿಕೆ ಸಂಗ್ರಹಣೆಗಾಗಿ ಡೇಟಾ-ಗುಣಲಕ್ಷಣಗಳನ್ನು ಬಳಸುತ್ತದೆ!

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

bootstrap-twipsy.js ಅನ್ನು ಬಳಸುವುದು

$ ( '#ಉದಾಹರಣೆ' ). ಟ್ವಿಪ್ಸಿ ( ಆಯ್ಕೆಗಳು )

ಆಯ್ಕೆಗಳು

ಹೆಸರು	ಮಾದರಿ	ಪೂರ್ವನಿಯೋಜಿತ	ವಿವರಣೆ
ಅನಿಮೇಟ್	ಬೂಲಿಯನ್	ನಿಜ	ಟೂಲ್‌ಟಿಪ್‌ಗೆ css ಫೇಡ್ ಪರಿವರ್ತನೆಯನ್ನು ಅನ್ವಯಿಸಿ
ವಿಳಂಬ	ಸಂಖ್ಯೆ	0	ಟೂಲ್ಟಿಪ್ (ಮಿಸೆ) ತೋರಿಸುವ ಮೊದಲು ವಿಳಂಬ
ವಿಳಂಬ	ಸಂಖ್ಯೆ	0	ಟೂಲ್ಟಿಪ್ (ಮಿಸೆ) ಮರೆಮಾಡುವ ಮೊದಲು ವಿಳಂಬ
ಹಿನ್ನಡೆ	ಸ್ಟ್ರಿಂಗ್	''	ಯಾವುದೇ ಟೂಲ್‌ಟಿಪ್ ಶೀರ್ಷಿಕೆ ಇಲ್ಲದಿದ್ದಾಗ ಬಳಸಲು ಪಠ್ಯ
ನಿಯೋಜನೆ	ಸ್ಟ್ರಿಂಗ್	'ಮೇಲೆ'	ಟೂಲ್ಟಿಪ್ ಅನ್ನು ಹೇಗೆ ಇರಿಸುವುದು - ಮೇಲೆ | ಕೆಳಗೆ | ಬಿಟ್ಟು | ಬಲ
html	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ಟೂಲ್ಟಿಪ್ನಲ್ಲಿ html ವಿಷಯವನ್ನು ಅನುಮತಿಸುತ್ತದೆ
ಬದುಕುತ್ತಾರೆ	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ವೈಯಕ್ತಿಕ ಈವೆಂಟ್ ಹ್ಯಾಂಡ್ಲರ್‌ಗಳ ಬದಲಿಗೆ ಈವೆಂಟ್ ನಿಯೋಗವನ್ನು ಬಳಸಿ
ಆಫ್ಸೆಟ್	ಸಂಖ್ಯೆ	0	ಗುರಿ ಅಂಶದಿಂದ ಟೂಲ್‌ಟಿಪ್‌ನ ಪಿಕ್ಸೆಲ್ ಆಫ್‌ಸೆಟ್
ಶೀರ್ಷಿಕೆ	ದಾರ | ಕಾರ್ಯ	'ಶೀರ್ಷಿಕೆ'	ಶೀರ್ಷಿಕೆ ಪಠ್ಯವನ್ನು ಹಿಂಪಡೆಯಲು ಗುಣಲಕ್ಷಣ ಅಥವಾ ವಿಧಾನ
ಪ್ರಚೋದಕ	ಸ್ಟ್ರಿಂಗ್	'ಹಾರಾಡುತ್ತಿರು'	ಟೂಲ್ಟಿಪ್ ಅನ್ನು ಹೇಗೆ ಟ್ರಿಗರ್ ಮಾಡಲಾಗಿದೆ - ಹೋವರ್ | ಗಮನ | ಕೈಪಿಡಿ

ವಿಧಾನಗಳು

$().twipsy(ಆಯ್ಕೆಗಳು)

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

.twipsy('ಶೋ')

ಟ್ವಿಪ್ಸಿ ಅಂಶಗಳನ್ನು ಬಹಿರಂಗಪಡಿಸುತ್ತದೆ.

$ ( '#ಅಂಶ' ). ಟ್ವಿಪ್ಸಿ ( 'ಶೋ' )

.twipsy('ಮರೆಮಾಡು')

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

$ ( '#ಅಂಶ' ). ಟ್ವಿಪ್ಸಿ ( 'ಮರೆಮಾಡು' )

.twipsy(ನಿಜ)

ಎಲಿಮೆಂಟ್ಸ್ ಟ್ವಿಪ್ಸಿ ಕ್ಲಾಸ್ ನಿದರ್ಶನವನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ.

$ ( '#ಅಂಶ' ). ಟ್ವಿಪ್ಸಿ ( ನಿಜ )

ಪರ್ಯಾಯವಾಗಿ ಗಮನಿಸಿ$().data('twipsy') , ಇದನ್ನು ನೊಂದಿಗೆ ಹಿಂಪಡೆಯಬಹುದು .

ಡೆಮೊ

ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ಗೆ ಪಾಪೋವರ್‌ಗಳನ್ನು ಸೇರಿಸಲು ಪಾಪೋವರ್ ಪ್ಲಗಿನ್ ಸರಳ ಇಂಟರ್ಫೇಸ್ ಅನ್ನು ಒದಗಿಸುತ್ತದೆ. ಇದು boostrap-twipsy.js ಪ್ಲಗಿನ್ ಅನ್ನು ವಿಸ್ತರಿಸುತ್ತದೆ, ಆದ್ದರಿಂದ ನಿಮ್ಮ ಪ್ರಾಜೆಕ್ಟ್‌ನಲ್ಲಿ ಪಾಪೋವರ್‌ಗಳನ್ನು ಸೇರಿಸುವಾಗ ಆ ಫೈಲ್ ಅನ್ನು ಪಡೆದುಕೊಳ್ಳಲು ಮರೆಯದಿರಿ!

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

boostrap-popover.js ಅನ್ನು ಬಳಸುವುದು

$ ( '#ಉದಾಹರಣೆ' ). ಪಾಪೋವರ್ ( ಆಯ್ಕೆಗಳು )

ಆಯ್ಕೆಗಳು

ಹೆಸರು	ಮಾದರಿ	ಪೂರ್ವನಿಯೋಜಿತ	ವಿವರಣೆ
ಅನಿಮೇಟ್	ಬೂಲಿಯನ್	ನಿಜ	ಟೂಲ್‌ಟಿಪ್‌ಗೆ css ಫೇಡ್ ಪರಿವರ್ತನೆಯನ್ನು ಅನ್ವಯಿಸಿ
ವಿಳಂಬ	ಸಂಖ್ಯೆ	0	ಟೂಲ್ಟಿಪ್ (ಮಿಸೆ) ತೋರಿಸುವ ಮೊದಲು ವಿಳಂಬ
ವಿಳಂಬ	ಸಂಖ್ಯೆ	0	ಟೂಲ್ಟಿಪ್ (ಮಿಸೆ) ಮರೆಮಾಡುವ ಮೊದಲು ವಿಳಂಬ
ಹಿನ್ನಡೆ	ಸ್ಟ್ರಿಂಗ್	''	ಯಾವುದೇ ಟೂಲ್‌ಟಿಪ್ ಶೀರ್ಷಿಕೆ ಇಲ್ಲದಿದ್ದಾಗ ಬಳಸಲು ಪಠ್ಯ
ನಿಯೋಜನೆ	ಸ್ಟ್ರಿಂಗ್	'ಬಲ'	ಟೂಲ್ಟಿಪ್ ಅನ್ನು ಹೇಗೆ ಇರಿಸುವುದು - ಮೇಲೆ | ಕೆಳಗೆ | ಬಿಟ್ಟು | ಬಲ
html	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ಟೂಲ್ಟಿಪ್ನಲ್ಲಿ html ವಿಷಯವನ್ನು ಅನುಮತಿಸುತ್ತದೆ
ಬದುಕುತ್ತಾರೆ	ಬೂಲಿಯನ್	ಸುಳ್ಳು	ವೈಯಕ್ತಿಕ ಈವೆಂಟ್ ಹ್ಯಾಂಡ್ಲರ್‌ಗಳ ಬದಲಿಗೆ ಈವೆಂಟ್ ನಿಯೋಗವನ್ನು ಬಳಸಿ
ಆಫ್ಸೆಟ್	ಸಂಖ್ಯೆ	0	ಗುರಿ ಅಂಶದಿಂದ ಟೂಲ್‌ಟಿಪ್‌ನ ಪಿಕ್ಸೆಲ್ ಆಫ್‌ಸೆಟ್
ಶೀರ್ಷಿಕೆ	ದಾರ | ಕಾರ್ಯ	'ಶೀರ್ಷಿಕೆ'	ಶೀರ್ಷಿಕೆ ಪಠ್ಯವನ್ನು ಹಿಂಪಡೆಯಲು ಗುಣಲಕ್ಷಣ ಅಥವಾ ವಿಧಾನ
ವಿಷಯ	ದಾರ | ಕಾರ್ಯ	'ಡೇಟಾ-ಕಂಟೆಂಟ್'	ವಿಷಯ ಪಠ್ಯವನ್ನು ಹಿಂಪಡೆಯಲು ಗುಣಲಕ್ಷಣ ಅಥವಾ ವಿಧಾನ
ಪ್ರಚೋದಕ	ಸ್ಟ್ರಿಂಗ್	'ಹಾರಾಡುತ್ತಿರು'	ಟೂಲ್ಟಿಪ್ ಅನ್ನು ಹೇಗೆ ಟ್ರಿಗರ್ ಮಾಡಲಾಗಿದೆ - ಹೋವರ್ | ಗಮನ | ಕೈಪಿಡಿ

ವಿಧಾನಗಳು

$().popover(ಆಯ್ಕೆಗಳು)

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

.popover('ಶೋ')

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

$ ( '#ಅಂಶ' ). ಪಾಪೋವರ್ ( 'ಶೋ' )

.popover('ಮರೆಮಾಡು')

ಪಾಪೋವರ್ ಅಂಶವನ್ನು ಮರೆಮಾಡುತ್ತದೆ.

$ ( '#ಅಂಶ' ). ಪಾಪೋವರ್ ( 'ಮರೆಮಾಡು' )

ಡೆಮೊ

ಪಾಪೋವರ್‌ಗಾಗಿ ಸುಳಿದಾಡಿ

ಎಚ್ಚರಿಕೆಯ ಪ್ಲಗಿನ್ ಎಚ್ಚರಿಕೆಗಳಿಗೆ ನಿಕಟ ಕಾರ್ಯವನ್ನು ಸೇರಿಸಲು ಒಂದು ಸೂಪರ್ ಸಣ್ಣ ವರ್ಗವಾಗಿದೆ.

ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ

bootstrap-alerts.js ಅನ್ನು ಬಳಸುವುದು

$ ( ".ಎಚ್ಚರಿಕೆ-ಸಂದೇಶ" ). ಎಚ್ಚರಿಕೆ ()

ಮಾರ್ಕ್ಅಪ್

data-alertನಿಮ್ಮ ಎಚ್ಚರಿಕೆ ಸಂದೇಶಗಳಿಗೆ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ನಿಕಟ ಕಾರ್ಯವನ್ನು ನೀಡಲು ಗುಣಲಕ್ಷಣವನ್ನು ಸೇರಿಸಿ .

ವಿಧಾನಗಳು

$().ಎಚ್ಚರಿಕೆ()

ನಿಕಟ ಕಾರ್ಯನಿರ್ವಹಣೆಯೊಂದಿಗೆ ಎಲ್ಲಾ ಎಚ್ಚರಿಕೆಗಳನ್ನು ಸುತ್ತುತ್ತದೆ. ಮುಚ್ಚಿದಾಗ ನಿಮ್ಮ ಎಚ್ಚರಿಕೆಗಳನ್ನು ಅನಿಮೇಟ್ ಮಾಡಲು, ಅವುಗಳಿಗೆ ಈಗಾಗಲೇ ಅನ್ವಯಿಸಲಾಗಿದೆ .fadeಮತ್ತು ವರ್ಗವನ್ನು ಹೊಂದಿದೆಯೇ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ..in

ಎಚ್ಚರಿಕೆ ('ಮುಚ್ಚಿ')

ಎಚ್ಚರಿಕೆಯನ್ನು ಮುಚ್ಚುತ್ತದೆ.

$ ( ".ಎಚ್ಚರಿಕೆ-ಸಂದೇಶ" ). ಎಚ್ಚರಿಕೆ ( 'ಮುಚ್ಚಿ' )

ಡೆಮೊ