jquery.collapse.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. /*!
  2. * Collapse plugin for jQuery
  3. * http://github.com/danielstocks/jQuery-Collapse/
  4. *
  5. * @author Daniel Stocks (http://webcloud.se)
  6. * @version 0.9.1
  7. * @updated 17-AUG-2010
  8. *
  9. * Copyright 2010, Daniel Stocks
  10. * Released under the MIT, BSD, and GPL Licenses.
  11. */
  12. (function($) {
  13. // Use a cookie counter to allow multiple instances of the plugin
  14. var cookieCounter = 0;
  15. $.fn.extend({
  16. collapse: function(options) {
  17. var defaults = {
  18. head : "h3",
  19. group : "div, ul",
  20. cookieName : "collapse",
  21. // Default function for showing content
  22. show: function() {
  23. this.show();
  24. },
  25. // Default function for hiding content
  26. hide: function() {
  27. this.hide();
  28. }
  29. };
  30. var op = $.extend(defaults, options);
  31. // Default CSS classes
  32. var active = "active",
  33. inactive = "inactive";
  34. return this.each(function() {
  35. // Increment coookie counter to ensure cookie name integrity
  36. cookieCounter++;
  37. var obj = $(this),
  38. // Find all headers and wrap them in <a> for accessibility.
  39. sections = obj.find(op.head).wrapInner('<a href="#"></a>'),
  40. l = sections.length,
  41. cookie = op.cookieName + "_" + cookieCounter;
  42. // Locate all panels directly following a header
  43. var panel = obj.find(op.head).map(function() {
  44. var head = $(this)
  45. if(!head.hasClass(active)) {
  46. return head.next(op.group).hide()[0];
  47. }
  48. return head.next(op.group)[0];
  49. });
  50. // Bind event for showing content
  51. obj.bind("show", function(e, bypass) {
  52. var obj = $(e.target);
  53. // ARIA attribute
  54. obj.attr('aria-hidden', false)
  55. .prev()
  56. .removeClass(inactive)
  57. .addClass(active);
  58. // Bypass method for instant display
  59. if(bypass) {
  60. obj.show();
  61. } else {
  62. op.show.call(obj);
  63. }
  64. });
  65. // Bind event for hiding content
  66. obj.bind("hide", function(e, bypass) {
  67. var obj = $(e.target);
  68. obj.attr('aria-hidden', true)
  69. .prev()
  70. .removeClass(active)
  71. .addClass(inactive);
  72. if(bypass) {
  73. obj.hide();
  74. } else {
  75. op.hide.call(obj);
  76. }
  77. });
  78. // Look for existing cookies
  79. if(cookieSupport) {
  80. for (var c=0;c<=l;c++) {
  81. var val = $.cookie(cookie + c);
  82. // Show content if associating cookie is found
  83. if ( val == c + "open" ) {
  84. panel.eq(c).trigger('show', [true]);
  85. // Hide content
  86. } else if ( val == c + "closed") {
  87. panel.eq(c).trigger('hide', [true]);
  88. }
  89. }
  90. }
  91. // Delegate click event to show/hide content.
  92. obj.bind("click", function(e) {
  93. var t = $(e.target);
  94. // Check if header was clicked
  95. if(!t.is(op.head)) {
  96. // What about link inside header.
  97. if ( t.parent().is(op.head) ) {
  98. t = t.parent();
  99. } else {
  100. return;
  101. }
  102. e.preventDefault();
  103. }
  104. // Figure out what position the clicked header has.
  105. var num = sections.index(t),
  106. cookieName = cookie + num,
  107. cookieVal = num,
  108. content = t.next(op.group);
  109. // If content is already active, hide it.
  110. if(t.hasClass(active)) {
  111. content.trigger('hide');
  112. cookieVal += 'closed';
  113. if(cookieSupport) {
  114. $.cookie(cookieName, cookieVal, { path: '/', expires: 10 });
  115. }
  116. return;
  117. }
  118. // Otherwise show it.
  119. content.trigger('show');
  120. cookieVal += 'open';
  121. if(cookieSupport) {
  122. $.cookie(cookieName, cookieVal, { path: '/', expires: 10 });
  123. }
  124. });
  125. });
  126. }
  127. });
  128. // Make sure can we eat cookies without getting into trouble.
  129. var cookieSupport = (function() {
  130. try {
  131. $.cookie('x', 'x', { path: '/', expires: 10 });
  132. $.cookie('x', null);
  133. }
  134. catch(e) {
  135. return false;
  136. }
  137. return true;
  138. })();
  139. })(jQuery);