hplus.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. //自定义js
  2. //公共配置
  3. $(document).ready(function () {
  4. // MetsiMenu
  5. $('#side-menu').metisMenu();
  6. // 打开右侧边栏
  7. $('.right-sidebar-toggle').click(function () {
  8. $('#right-sidebar').toggleClass('sidebar-open');
  9. });
  10. // 右侧边栏使用slimscroll
  11. $('.sidebar-container').slimScroll({
  12. height: '100%',
  13. railOpacity: 0.4,
  14. wheelStep: 10
  15. });
  16. // 打开聊天窗口
  17. $('.open-small-chat').click(function () {
  18. $(this).children().toggleClass('fa-comments').toggleClass('fa-remove');
  19. $('.small-chat-box').toggleClass('active');
  20. });
  21. // 聊天窗口使用slimscroll
  22. $('.small-chat-box .content').slimScroll({
  23. height: '234px',
  24. railOpacity: 0.4
  25. });
  26. // Small todo handler
  27. $('.check-link').click(function () {
  28. var button = $(this).find('i');
  29. var label = $(this).next('span');
  30. button.toggleClass('fa-check-square').toggleClass('fa-square-o');
  31. label.toggleClass('todo-completed');
  32. return false;
  33. });
  34. //固定菜单栏
  35. $(function () {
  36. $('.sidebar-collapse').slimScroll({
  37. height: '100%',
  38. railOpacity: 0.9,
  39. alwaysVisible: false
  40. });
  41. });
  42. // 菜单切换
  43. $('.navbar-minimalize').click(function () {
  44. $("body").toggleClass("mini-navbar");
  45. SmoothlyMenu();
  46. });
  47. // 侧边栏高度
  48. function fix_height() {
  49. var heightWithoutNavbar = $("body > #wrapper").height() - 61;
  50. $(".sidebard-panel").css("min-height", heightWithoutNavbar + "px");
  51. }
  52. fix_height();
  53. $(window).bind("load resize click scroll", function () {
  54. if (!$("body").hasClass('body-small')) {
  55. fix_height();
  56. }
  57. });
  58. //侧边栏滚动
  59. $(window).scroll(function () {
  60. if ($(window).scrollTop() > 0 && !$('body').hasClass('fixed-nav')) {
  61. $('#right-sidebar').addClass('sidebar-top');
  62. } else {
  63. $('#right-sidebar').removeClass('sidebar-top');
  64. }
  65. });
  66. $('.full-height-scroll').slimScroll({
  67. height: '100%'
  68. });
  69. $('#side-menu>li').click(function () {
  70. if ($('body').hasClass('mini-navbar')) {
  71. NavToggle();
  72. }
  73. });
  74. $('#side-menu>li li a').click(function () {
  75. if ($(window).width() < 769) {
  76. NavToggle();
  77. }
  78. });
  79. $('.nav-close').click(NavToggle);
  80. //ios浏览器兼容性处理
  81. if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
  82. $('#content-main').css('overflow-y', 'auto');
  83. }
  84. });
  85. $(window).bind("load resize", function () {
  86. if ($(this).width() < 769) {
  87. $('body').addClass('mini-navbar');
  88. $('.navbar-static-side').fadeIn();
  89. }
  90. });
  91. function NavToggle() {
  92. $('.navbar-minimalize').trigger('click');
  93. }
  94. function SmoothlyMenu() {
  95. if (!$('body').hasClass('mini-navbar')) {
  96. $('#side-menu').hide();
  97. setTimeout(
  98. function () {
  99. $('#side-menu').fadeIn(500);
  100. }, 100);
  101. } else if ($('body').hasClass('fixed-sidebar')) {
  102. $('#side-menu').hide();
  103. setTimeout(
  104. function () {
  105. $('#side-menu').fadeIn(500);
  106. }, 300);
  107. } else {
  108. $('#side-menu').removeAttr('style');
  109. }
  110. }
  111. //主题设置
  112. $(function () {
  113. // 顶部菜单固定
  114. $('#fixednavbar').click(function () {
  115. if ($('#fixednavbar').is(':checked')) {
  116. $(".navbar-static-top").removeClass('navbar-static-top').addClass('navbar-fixed-top');
  117. $("body").removeClass('boxed-layout');
  118. $("body").addClass('fixed-nav');
  119. $('#boxedlayout').prop('checked', false);
  120. if (localStorageSupport) {
  121. localStorage.setItem("boxedlayout", 'off');
  122. }
  123. if (localStorageSupport) {
  124. localStorage.setItem("fixednavbar", 'on');
  125. }
  126. } else {
  127. $(".navbar-fixed-top").removeClass('navbar-fixed-top').addClass('navbar-static-top');
  128. $("body").removeClass('fixed-nav');
  129. if (localStorageSupport) {
  130. localStorage.setItem("fixednavbar", 'off');
  131. }
  132. }
  133. });
  134. // 收起左侧菜单
  135. $('#collapsemenu').click(function () {
  136. if ($('#collapsemenu').is(':checked')) {
  137. $("body").addClass('mini-navbar');
  138. SmoothlyMenu();
  139. if (localStorageSupport) {
  140. localStorage.setItem("collapse_menu", 'on');
  141. }
  142. } else {
  143. $("body").removeClass('mini-navbar');
  144. SmoothlyMenu();
  145. if (localStorageSupport) {
  146. localStorage.setItem("collapse_menu", 'off');
  147. }
  148. }
  149. });
  150. // 固定宽度
  151. $('#boxedlayout').click(function () {
  152. if ($('#boxedlayout').is(':checked')) {
  153. $("body").addClass('boxed-layout');
  154. $('#fixednavbar').prop('checked', false);
  155. $(".navbar-fixed-top").removeClass('navbar-fixed-top').addClass('navbar-static-top');
  156. $("body").removeClass('fixed-nav');
  157. if (localStorageSupport) {
  158. localStorage.setItem("fixednavbar", 'off');
  159. }
  160. if (localStorageSupport) {
  161. localStorage.setItem("boxedlayout", 'on');
  162. }
  163. } else {
  164. $("body").removeClass('boxed-layout');
  165. if (localStorageSupport) {
  166. localStorage.setItem("boxedlayout", 'off');
  167. }
  168. }
  169. });
  170. // 默认主题
  171. $('.s-skin-0').click(function () {
  172. $("body").removeClass("skin-1");
  173. $("body").removeClass("skin-2");
  174. $("body").removeClass("skin-3");
  175. return false;
  176. });
  177. // 蓝色主题
  178. $('.s-skin-1').click(function () {
  179. $("body").removeClass("skin-2");
  180. $("body").removeClass("skin-3");
  181. $("body").addClass("skin-1");
  182. return false;
  183. });
  184. // 黄色主题
  185. $('.s-skin-3').click(function () {
  186. $("body").removeClass("skin-1");
  187. $("body").removeClass("skin-2");
  188. $("body").addClass("skin-3");
  189. return false;
  190. });
  191. if (localStorageSupport) {
  192. var collapse = localStorage.getItem("collapse_menu");
  193. var fixednavbar = localStorage.getItem("fixednavbar");
  194. var boxedlayout = localStorage.getItem("boxedlayout");
  195. if (collapse == 'on') {
  196. $('#collapsemenu').prop('checked', 'checked')
  197. }
  198. if (fixednavbar == 'on') {
  199. $('#fixednavbar').prop('checked', 'checked')
  200. }
  201. if (boxedlayout == 'on') {
  202. $('#boxedlayout').prop('checked', 'checked')
  203. }
  204. }
  205. if (localStorageSupport) {
  206. var collapse = localStorage.getItem("collapse_menu");
  207. var fixednavbar = localStorage.getItem("fixednavbar");
  208. var boxedlayout = localStorage.getItem("boxedlayout");
  209. var body = $('body');
  210. if (collapse == 'on') {
  211. if (!body.hasClass('body-small')) {
  212. body.addClass('mini-navbar');
  213. }
  214. }
  215. if (fixednavbar == 'on') {
  216. $(".navbar-static-top").removeClass('navbar-static-top').addClass('navbar-fixed-top');
  217. body.addClass('fixed-nav');
  218. }
  219. if (boxedlayout == 'on') {
  220. body.addClass('boxed-layout');
  221. }
  222. }
  223. });
  224. //判断浏览器是否支持html5本地存储
  225. function localStorageSupport() {
  226. return (('localStorage' in window) && window['localStorage'] !== null)
  227. }