ligerAccordion.js 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. /**
  2. * jQuery ligerUI 1.1.9
  3. *
  4. * http://ligerui.com
  5. *
  6. * Author daomi 2012 [ gd_star@163.com ]
  7. *
  8. */
  9. (function ($)
  10. {
  11. $.fn.ligerAccordion = function (options)
  12. {
  13. return $.ligerui.run.call(this, "ligerAccordion", arguments);
  14. };
  15. $.fn.ligerGetAccordionManager = function ()
  16. {
  17. return $.ligerui.get(this);
  18. };
  19. $.ligerDefaults.Accordion = {
  20. height: null,
  21. speed: "normal",
  22. changeHeightOnResize: false,
  23. heightDiff: 0 // 高度补差
  24. };
  25. $.ligerMethos.Accordion = {};
  26. $.ligerui.controls.Accordion = function (element, options)
  27. {
  28. $.ligerui.controls.Accordion.base.constructor.call(this, element, options);
  29. };
  30. $.ligerui.controls.Accordion.ligerExtend($.ligerui.core.UIComponent, {
  31. __getType: function ()
  32. {
  33. return 'Accordion';
  34. },
  35. __idPrev: function ()
  36. {
  37. return 'Accordion';
  38. },
  39. _extendMethods: function ()
  40. {
  41. return $.ligerMethos.Accordion;
  42. },
  43. _render: function ()
  44. {
  45. var g = this, p = this.options;
  46. g.accordion = $(g.element);
  47. if (!g.accordion.hasClass("l-accordion-panel")) g.accordion.addClass("l-accordion-panel");
  48. var selectedIndex = 0;
  49. if ($("> div[lselected=true]", g.accordion).length > 0)
  50. selectedIndex = $("> div", g.accordion).index($("> div[lselected=true]", g.accordion));
  51. $("> div", g.accordion).each(function (i, box)
  52. {
  53. var header = $('<div class="l-accordion-header"><div class="l-accordion-toggle"></div><div class="l-accordion-header-inner"></div></div>');
  54. if (i == selectedIndex)
  55. $(".l-accordion-toggle", header).addClass("l-accordion-toggle-open");
  56. if ($(box).attr("title"))
  57. {
  58. $(".l-accordion-header-inner", header).html($(box).attr("title"));
  59. $(box).attr("title", "");
  60. }
  61. $(box).before(header);
  62. if (!$(box).hasClass("l-accordion-content")) $(box).addClass("l-accordion-content");
  63. });
  64. //add Even
  65. $(".l-accordion-toggle", g.accordion).each(function ()
  66. {
  67. if (!$(this).hasClass("l-accordion-toggle-open") && !$(this).hasClass("l-accordion-toggle-close"))
  68. {
  69. $(this).addClass("l-accordion-toggle-close");
  70. }
  71. if ($(this).hasClass("l-accordion-toggle-close"))
  72. {
  73. $(this).parent().next(".l-accordion-content:visible").hide();
  74. }
  75. });
  76. $(".l-accordion-toggle", g.accordion).hover(function ()
  77. {
  78. if ($(this).hasClass("l-accordion-toggle-open"))
  79. $(this).addClass("l-accordion-toggle-open-over");
  80. else if ($(this).hasClass("l-accordion-toggle-close"))
  81. $(this).addClass("l-accordion-toggle-close-over");
  82. }, function ()
  83. {
  84. if ($(this).hasClass("l-accordion-toggle-open"))
  85. $(this).removeClass("l-accordion-toggle-open-over");
  86. else if ($(this).hasClass("l-accordion-toggle-close"))
  87. $(this).removeClass("l-accordion-toggle-close-over");
  88. });
  89. $(">.l-accordion-header", g.accordion).click(function ()
  90. {
  91. var togglebtn = $(".l-accordion-toggle:first", this);
  92. if (togglebtn.hasClass("l-accordion-toggle-close"))
  93. {
  94. togglebtn.removeClass("l-accordion-toggle-close")
  95. .removeClass("l-accordion-toggle-close-over l-accordion-toggle-open-over")
  96. togglebtn.addClass("l-accordion-toggle-open");
  97. $(this).next(".l-accordion-content")
  98. .show(p.speed)
  99. .siblings(".l-accordion-content:visible").hide(p.speed);
  100. $(this).siblings(".l-accordion-header").find(".l-accordion-toggle").removeClass("l-accordion-toggle-open").addClass("l-accordion-toggle-close");
  101. }
  102. else
  103. {
  104. togglebtn.removeClass("l-accordion-toggle-open")
  105. .removeClass("l-accordion-toggle-close-over l-accordion-toggle-open-over")
  106. .addClass("l-accordion-toggle-close");
  107. $(this).next(".l-accordion-content").hide(p.speed);
  108. }
  109. });
  110. //init
  111. g.headerHoldHeight = 0;
  112. $("> .l-accordion-header", g.accordion).each(function ()
  113. {
  114. g.headerHoldHeight += $(this).height();
  115. });
  116. if (p.height && typeof (p.height) == 'string' && p.height.indexOf('%') > 0)
  117. {
  118. g.onResize();
  119. if (p.changeHeightOnResize)
  120. {
  121. $(window).resize(function ()
  122. {
  123. g.onResize();
  124. });
  125. }
  126. }
  127. else
  128. {
  129. if (p.height)
  130. {
  131. g.height = p.heightDiff + p.height;
  132. g.accordion.height(g.height);
  133. g.setHeight(p.height);
  134. }
  135. else
  136. {
  137. g.header = g.accordion.height();
  138. }
  139. }
  140. g.set(p);
  141. },
  142. onResize: function ()
  143. {
  144. var g = this, p = this.options;
  145. if (!p.height || typeof (p.height) != 'string' || p.height.indexOf('%') == -1) return false;
  146. //set accordion height
  147. if (g.accordion.parent()[0].tagName.toLowerCase() == "body")
  148. {
  149. var windowHeight = $(window).height();
  150. windowHeight -= parseInt(g.layout.parent().css('paddingTop'));
  151. windowHeight -= parseInt(g.layout.parent().css('paddingBottom'));
  152. g.height = p.heightDiff + windowHeight * parseFloat(g.height) * 0.01;
  153. }
  154. else
  155. {
  156. g.height = p.heightDiff + (g.accordion.parent().height() * parseFloat(p.height) * 0.01);
  157. }
  158. g.accordion.height(g.height);
  159. g.setContentHeight(g.height - g.headerHoldHeight);
  160. },
  161. setHeight: function (height)
  162. {
  163. var g = this, p = this.options;
  164. g.accordion.height(height);
  165. height -= g.headerHoldHeight;
  166. $("> .l-accordion-content", g.accordion).height(height);
  167. }
  168. });
  169. })(jQuery);