jquery.jspclicknscroll.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. /*
  2. * jQuery.JSPclickNScroll v1.0
  3. *
  4. * Copyright (c) 2010 Joshua Faulkenberry
  5. * Dual licensed under the MIT and GPL licenses.
  6. * Joshua Faulkenberry
  7. *
  8. * $Date: 2010-10-25 18:55:27 -0700 (Mon, 25 Oct 2010) $
  9. * $Revision: 5 $
  10. */
  11. (function($){
  12. jQuery.extend({
  13. mouse: {
  14. x: 0,
  15. y: 0
  16. },
  17. JSPclickNScroll: {
  18. mousedown:false,
  19. emaX: 0,
  20. emaY: 0
  21. }
  22. });
  23. jQuery.fn.extend({
  24. JSPclickNScroll: function(options) {
  25. var ops = $.extend({
  26. allowHiliting:false,
  27. acceleration:.65,
  28. deceleration:.85,
  29. decelRate:64,
  30. reverse:false,
  31. rightMouse:false,
  32. allowThrowing:true,
  33. throwOnOut:true
  34. }, options || {});
  35. return this.each(function(){
  36. var $this = $(this).data("options", ops);
  37. if(!ops.allowHiliting) {
  38. if (jQuery.browser.msie) {
  39. $this.get(0).onselectstart = function () { return false; };
  40. }
  41. else {
  42. $this.get(0).onmousedown = function(e){e.preventDefault()}
  43. }
  44. }
  45. $this.mousedown(function(e) {
  46. $.JSPclickNScroll.mousedown = $this;
  47. }).mouseup(function(e) {
  48. if(ops.allowThrowing) sling($(this));
  49. $.JSPclickNScroll.mousedown = false;
  50. }).mouseout(function(e) {
  51. var from = e.relatedTarget || e.toElement;
  52. if (!from || from.nodeName == "HTML") {
  53. if($.JSPclickNScroll.mousedown && ops.allowThrowing && ops.throwOnOut) sling($(this));
  54. $.JSPclickNScroll.mousedown = false;
  55. }
  56. })
  57. });
  58. }
  59. });
  60. function sling($this) {
  61. var ops = $this.data("options"),
  62. changeX = ($.JSPclickNScroll.emaX)*ops.deceleration,
  63. changeY = ($.JSPclickNScroll.emaY)*ops.deceleration;
  64. if((changeX < .01 && changeX > -.01) || (changeY < .01 && changeY > -.01)) {return;}
  65. move($this, changeX, changeY);
  66. setTimeout(function() {
  67. sling($this);
  68. }, 1000/ops.decelRate);
  69. }
  70. function move($this, changeX, changeY) {
  71. if(($.JSPclickNScroll.emaX < 0 && changeX > 0) || ($.JSPclickNScroll.emaX > 0 && changeX < 0)) $.JSPclickNScroll.emaX = 0;
  72. if(($.JSPclickNScroll.emaY < 0 && changeY > 0) || ($.JSPclickNScroll.emaY > 0 && changeY < 0)) $.JSPclickNScroll.emaY = 0;
  73. var ops = $this.data("options"),
  74. amntX = ops.acceleration * changeX + (1 - ops.acceleration) * $.JSPclickNScroll.emaX,
  75. amntY = ops.acceleration * changeY + (1 - ops.acceleration) * $.JSPclickNScroll.emaY,
  76. scrollRight = $this[0].scrollWidth ? $this[0].scrollWidth - $this[0].clientWidth : $this[0].body.scrollWidth - $this[0].body.clientWidth,
  77. scrollBottom = $this[0].scrollHeight ? $this[0].scrollHeight - $this[0].clientHeight : $this[0].body.scrollHeight - $this[0].body.clientHeight,
  78. api = $this.data('jsp');
  79. if(($this.scrollLeft() <= 0 && changeX <= 0) || ($this.scrollLeft() >= scrollRight && changeX >= 0)) {}
  80. // else $this.scrollLeft($this.scrollLeft() + (amntX));
  81. api.scrollBy(amntX, 0);
  82. if(($this.scrollTop() <= 0 && changeY <= 0) || ($this.scrollTop() >= scrollBottom && changeY >= 0)) {}
  83. // else $this.scrollTop($this.scrollTop() + (amntY));
  84. api.scrollBy(0, amntY);
  85. $.JSPclickNScroll.emaX = amntX;
  86. $.JSPclickNScroll.emaY = amntY;
  87. }
  88. $(document).mousemove(function(e) {
  89. if($.JSPclickNScroll.mousedown) {
  90. var $this = $.JSPclickNScroll.mousedown,
  91. ops = $this.data("options");
  92. if(ops.rightMouse && e.button != 2) return;
  93. else if(!ops.rightMouse && e.button == 2) return;
  94. var changeX = e.pageX - $.mouse.x,
  95. changeY = e.pageY - $.mouse.y;
  96. if(!ops.reverse) {
  97. changeX = 0-changeX;
  98. changeY = 0-changeY;
  99. }
  100. move($this, changeX, changeY);
  101. }
  102. $.mouse = {
  103. x: e.pageX,
  104. y: e.pageY
  105. };
  106. });
  107. })(jQuery);