2

I want to know how to differentiate between two different events "Roll up" and "roll down". Function1 should execute on rollup and Function2 on rolldown. I just saw onmousewheel and onscroll events, which are called on roll up/down both.

for clearing my question :

function up(){  alert("you rolled up with mouse wheel")};
function down() { alert("you rolled down with mouse wheel")};

How to avoid above functions to be executed at the same time?

mehulmpt
  • 15,861
  • 12
  • 48
  • 88
Iman Emadi
  • 421
  • 4
  • 14

1 Answers1

1

You could check this answer if you want to use jQuery:

How can I determine the direction of a jQuery scroll event?

var lastScrollTop = 0;
$(window).scroll(function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
       // downscroll code
   } else {
      // upscroll code
   }
   lastScrollTop = st;
});

Basically you store the last scroll value and compare it with the new one. There is also a cool code pen sample with a delta value to configure the sensibility of the solution: https://codepen.io/josiahruddell/pen/piFfq

Juan Marcos Armella
  • 737
  • 6
  • 13
  • well , what if i dont want my page to be scrolled .? like i add e.preventDefault(); to avoid window to be scrolled , this question comes from when i saw an horizontal slider which with rolling up it would move right and with roll down it would move left , and it had e.preventDefault(); to avoid window to be scrolled when the cursor is on that slider . – Iman Emadi Mar 31 '18 at 14:24
  • Check this answer for that: https://stackoverflow.com/questions/24217087/how-to-determine-scroll-direction-without-actually-scrolling (thanks to @epascarello) – Juan Marcos Armella Mar 31 '18 at 15:19
  • 1
    Many thanks to you , that is the right solution , – Iman Emadi Apr 01 '18 at 10:45