tooltip.js 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. /*=========================================================================================
  2. File Name: tooltip.js
  3. Description: Tooltips are an updated version, which don’t rely on images,
  4. use CSS3 for animations, and data-attributes for local title storage.
  5. ----------------------------------------------------------------------------------------
  6. Item Name: Robust - Responsive Admin Theme
  7. Version: 1.2
  8. Author: GeeksLabs
  9. Author URL: http://www.themeforest.net/user/geekslabs
  10. ==========================================================================================*/
  11. (function(window, document, $) {
  12. 'use strict';
  13. /******************/
  14. // Tooltip events //
  15. /******************/
  16. // onShow event
  17. $('#show-tooltip').tooltip({
  18. title: 'Tooltip Show Event',
  19. trigger: 'click',
  20. placement: 'right'
  21. }).on('show.bs.tooltip', function() {
  22. alert('Show event fired.');
  23. });
  24. // onShown event
  25. $('#shown-tooltip').tooltip({
  26. title: 'Tooltip Shown Event',
  27. trigger: 'click',
  28. placement: 'top'
  29. }).on('shown.bs.tooltip', function() {
  30. alert('Shown event fired.');
  31. });
  32. // onHide event
  33. $('#hide-tooltip').tooltip({
  34. title: 'Tooltip Hide Event',
  35. trigger: 'click',
  36. placement: 'bottom'
  37. }).on('hide.bs.tooltip', function() {
  38. alert('Hide event fired.');
  39. });
  40. // onHidden event
  41. $('#hidden-tooltip').tooltip({
  42. title: 'Tooltip Hidden Event',
  43. trigger: 'click',
  44. placement: 'left'
  45. }).on('hidden.bs.tooltip', function() {
  46. alert('Hidden event fired.');
  47. });
  48. /*******************/
  49. // Tooltip methods //
  50. /*******************/
  51. // Show method
  52. $('#show-method').on('click', function() {
  53. $(this).tooltip('show');
  54. });
  55. // Hide method
  56. $('#hide-method').on('mouseenter', function() {
  57. $(this).tooltip('show');
  58. });
  59. $('#hide-method').on('click', function() {
  60. $(this).tooltip('hide');
  61. });
  62. // Toggle method
  63. $('#toggle-method').on('click', function() {
  64. $(this).tooltip('toggle');
  65. });
  66. // Dispose method
  67. $('#dispose').on('click', function() {
  68. $('#dispose-method').tooltip('dispose');
  69. });
  70. /* Trigger*/
  71. $('.manual').on('click', function() {
  72. $(this).tooltip('show');
  73. });
  74. $('.manual').on('mouseout', function() {
  75. $(this).tooltip('hide');
  76. });
  77. })(window, document, jQuery);