Guest User

Untitled

a guest
Aug 15th, 2018
88
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.65 KB | None | 0 0
  1. YUI3 scrollView and mousewheel
  2. var scrollView = new Y.ScrollView({
  3. id: "scrollview",
  4. srcNode: '.scrollview-item',
  5. height: 375,
  6. flick: {
  7. minDistance: 10,
  8. minVelocity: 0.3,
  9. axis: "y"
  10. }
  11. });
  12. scrollView.render();
  13.  
  14. var DOM_MOUSE_SCROLL = 'DOMMouseScroll',
  15. fixArgs = function(args) {
  16. var a = Y.Array(args, 0, true), target;
  17. if (Y.UA.gecko) {
  18. a[0] = DOM_MOUSE_SCROLL;
  19. // target = Y.config.win;
  20. } else {
  21. // target = Y.config.doc;
  22. }
  23.  
  24. if (a.length < 3) {
  25. // a[2] = target;
  26. } else {
  27. // a.splice(2, 0, target);
  28. }
  29.  
  30. return a;
  31. };
  32.  
  33. Y.Env.evt.plugins.mousewheel = {
  34. on: function() {
  35. return Y.Event._attach(fixArgs(arguments));
  36. },
  37.  
  38. detach: function() {
  39. return Y.Event.detach.apply(Y.Event, fixArgs(arguments));
  40. }
  41. };
  42.  
  43. // ScrollView
  44. var scrollView = new Y.ScrollView({
  45. id: "scrollview",
  46. srcNode: '#mycontainer',
  47. height: 490,
  48. flick: {
  49. minDistance:10,
  50. minVelocity:0.3,
  51. axis: "y"
  52. }
  53. });
  54.  
  55. scrollView.render();
  56.  
  57. var content = scrollView.get("contentBox");
  58. var scroll_modifier = 10; // 10px per Delta
  59. var current_scroll_y, scroll_to;
  60.  
  61. content.on("mousewheel", function(e) {
  62. // check whether this is the scrollview container
  63. if ( e.currentTarget.hasClass('container') ) {
  64. current_scroll_y = scrollView.get('scrollY');
  65. scroll_to = current_scroll_y - ( scroll_modifier * e.wheelDelta );
  66.  
  67. // trying to scroll above top of the container - scroll to start
  68. if ( scroll_to <= scrollView._minScrollY ) {
  69. // in my case, this made the scrollbars plugin to move, but I'm quite sure it's important for other stuff as well :)
  70. scrollView._uiDimensionsChange();
  71. scrollView.scrollTo(0, scrollView._minScrollY);
  72. } else if ( scroll_to >= scrollView._maxScrollY ) { // trying to scroll beneath the end of the container - scroll to end
  73. scrollView._uiDimensionsChange();
  74. scrollView.scrollTo(0, scrollView._maxScrollY);
  75. } else { // otherwise just scroll to the calculated Y
  76. scrollView._uiDimensionsChange();
  77. scrollView.scrollTo(0, scroll_to);
  78. };
  79. // if we have scrollbars plugin, flash the scrollbar
  80. if ( scrollView.scrollbars ) {
  81. scrollView.scrollbars.flash();
  82. };
  83.  
  84. // prevent browser default behavior on mouse scroll
  85. e.preventDefault();
  86. };
  87. });
Add Comment
Please, Sign In to add comment