Нет описания

jquery.slimscroll.js 6.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. /*! Copyright (c) 2011 Piotr Rochala (http://rocha.la)
  2. * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
  3. * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
  4. *
  5. * Version: 1.3.0
  6. *
  7. */
  8. (function(f) {
  9. jQuery.fn.extend({
  10. slimScroll: function(h) {
  11. var a = f.extend({
  12. width: "auto",
  13. height: "250px",
  14. size: "4px",
  15. color: "#000",
  16. position: "right",
  17. distance: "1px",
  18. start: "top",
  19. opacity: 0.4,
  20. alwaysVisible: !1,
  21. disableFadeOut: !1,
  22. railVisible: !1,
  23. railColor: "#333",
  24. railOpacity: 0.2,
  25. railDraggable: !0,
  26. railClass: "slimScrollRail",
  27. barClass: "slimScrollBar",
  28. wrapperClass: "slimScrollDiv",
  29. allowPageScroll: !1,
  30. wheelStep: 20,
  31. touchScrollStep: 200,
  32. borderRadius: "7px",
  33. railBorderRadius: "7px"
  34. }, h);
  35. this.each(function() {
  36. function r(d) {
  37. if(s) {
  38. d = d ||
  39. window.event;
  40. var c = 0;
  41. d.wheelDelta && (c = -d.wheelDelta / 120);
  42. d.detail && (c = d.detail / 3);
  43. f(d.target || d.srcTarget || d.srcElement).closest("." + a.wrapperClass).is(b.parent()) && m(c, !0);
  44. // 解决此问题[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive.
  45. // d.preventDefault && !k && d.preventDefault();
  46. k || (d.returnValue = !1)
  47. }
  48. }
  49. function m(d, f, h) {
  50. k = !1;
  51. var e = d,
  52. g = b.outerHeight() - c.outerHeight();
  53. f && (e = parseInt(c.css("top")) + d * parseInt(a.wheelStep) / 100 * c.outerHeight(), e = Math.min(Math.max(e, 0), g), e = 0 < d ? Math.ceil(e) : Math.floor(e), c.css({
  54. top: e + "px"
  55. }));
  56. l = parseInt(c.css("top")) / (b.outerHeight() - c.outerHeight());
  57. e = l * (b[0].scrollHeight - b.outerHeight());
  58. h && (e = d, d = e / b[0].scrollHeight * b.outerHeight(), d = Math.min(Math.max(d, 0), g), c.css({
  59. top: d + "px"
  60. }));
  61. b.scrollTop(e);
  62. b.trigger("slimscrolling", ~~e);
  63. v();
  64. p()
  65. }
  66. function C() {
  67. window.addEventListener ? (this.addEventListener("DOMMouseScroll", r, !1), this.addEventListener("mousewheel", r, !1), this.addEventListener("MozMousePixelScroll", r, !1)) : document.attachEvent("onmousewheel", r)
  68. }
  69. function w() {
  70. u = Math.max(b.outerHeight() / b[0].scrollHeight * b.outerHeight(), D);
  71. c.css({
  72. height: u + "px"
  73. });
  74. var a = u == b.outerHeight() ? "none" : "block";
  75. c.css({
  76. display: a
  77. })
  78. }
  79. function v() {
  80. w();
  81. clearTimeout(A);
  82. l == ~~l ? (k = a.allowPageScroll, B != l && b.trigger("slimscroll", 0 == ~~l ? "top" : "bottom")) : k = !1;
  83. B = l;
  84. u >= b.outerHeight() ? k = !0 : (c.stop(!0, !0).fadeIn("fast"), a.railVisible && g.stop(!0, !0).fadeIn("fast"))
  85. }
  86. function p() {
  87. a.alwaysVisible || (A = setTimeout(function() {
  88. a.disableFadeOut && s || (x || y) || (c.fadeOut("slow"), g.fadeOut("slow"))
  89. }, 1E3))
  90. }
  91. var s, x, y, A, z, u, l, B, D = 30,
  92. k = !1,
  93. b = f(this);
  94. if(b.parent().hasClass(a.wrapperClass)) {
  95. var n = b.scrollTop(),
  96. c = b.parent().find("." + a.barClass),
  97. g = b.parent().find("." + a.railClass);
  98. w();
  99. if(f.isPlainObject(h)) {
  100. if("height" in h && "auto" == h.height) {
  101. b.parent().css("height", "auto");
  102. b.css("height", "auto");
  103. var q = b.parent().parent().height();
  104. b.parent().css("height", q);
  105. b.css("height", q)
  106. }
  107. if("scrollTo" in h) n = parseInt(a.scrollTo);
  108. else if("scrollBy" in h) n += parseInt(a.scrollBy);
  109. else if("destroy" in h) {
  110. c.remove();
  111. g.remove();
  112. b.unwrap();
  113. return
  114. }
  115. m(n, !1, !0)
  116. }
  117. } else {
  118. a.height = "auto" == a.height ? b.parent().height() : a.height;
  119. n = f("<div></div>").addClass(a.wrapperClass).css({
  120. position: "relative",
  121. width: a.width,
  122. height: a.height
  123. });
  124. b.css({
  125. width: a.width,
  126. height: a.height
  127. });
  128. var g = f("<div></div>").addClass(a.railClass).css({
  129. width: a.size,
  130. height: "100%",
  131. position: "absolute",
  132. top: 0,
  133. display: a.alwaysVisible && a.railVisible ? "block" : "none",
  134. "border-radius": a.railBorderRadius,
  135. background: a.railColor,
  136. opacity: a.railOpacity,
  137. zIndex: 90
  138. }),
  139. c = f("<div></div>").addClass(a.barClass).css({
  140. background: a.color,
  141. width: a.size,
  142. position: "absolute",
  143. top: 0,
  144. opacity: a.opacity,
  145. display: a.alwaysVisible ?
  146. "block" : "none",
  147. "border-radius": a.borderRadius,
  148. BorderRadius: a.borderRadius,
  149. MozBorderRadius: a.borderRadius,
  150. WebkitBorderRadius: a.borderRadius,
  151. zIndex: 99
  152. }),
  153. q = "right" == a.position ? {
  154. right: a.distance
  155. } : {
  156. left: a.distance
  157. };
  158. g.css(q);
  159. c.css(q);
  160. b.wrap(n);
  161. b.parent().append(c);
  162. b.parent().append(g);
  163. a.railDraggable && c.bind("mousedown", function(a) {
  164. var b = f(document);
  165. y = !0;
  166. t = parseFloat(c.css("top"));
  167. pageY = a.pageY;
  168. b.bind("mousemove.slimscroll", function(a) {
  169. currTop = t + a.pageY - pageY;
  170. c.css("top", currTop);
  171. m(0, c.position().top, !1)
  172. });
  173. b.bind("mouseup.slimscroll", function(a) {
  174. y = !1;
  175. p();
  176. b.unbind(".slimscroll")
  177. });
  178. return !1
  179. }).bind("selectstart.slimscroll", function(a) {
  180. a.stopPropagation();
  181. a.preventDefault();
  182. return !1
  183. });
  184. g.hover(function() {
  185. v()
  186. }, function() {
  187. p()
  188. });
  189. c.hover(function() {
  190. x = !0
  191. }, function() {
  192. x = !1
  193. });
  194. b.hover(function() {
  195. s = !0;
  196. v();
  197. p()
  198. }, function() {
  199. s = !1;
  200. p()
  201. });
  202. b.bind("touchstart", function(a, b) {
  203. a.originalEvent.touches.length && (z = a.originalEvent.touches[0].pageY)
  204. });
  205. b.bind("touchmove", function(b) {
  206. k || b.originalEvent.preventDefault();
  207. b.originalEvent.touches.length &&
  208. (m((z - b.originalEvent.touches[0].pageY) / a.touchScrollStep, !0), z = b.originalEvent.touches[0].pageY)
  209. });
  210. w();
  211. "bottom" === a.start ? (c.css({
  212. top: b.outerHeight() - c.outerHeight()
  213. }), m(0, !0)) : "top" !== a.start && (m(f(a.start).position().top, null, !0), a.alwaysVisible || c.hide());
  214. C()
  215. }
  216. });
  217. return this
  218. }
  219. });
  220. jQuery.fn.extend({
  221. slimscroll: jQuery.fn.slimScroll
  222. })
  223. })(jQuery);