Stop cursor from changing on a cursor div when the user scrolling the document jquery

Question

Today I found out that Google+ set the cursor to initial when the user is scrolling, and the cursor won't change when hovering on all the hyperlinks or images while the user is still scrolling

How can I stop cursor from changing when the user is scrolling through divs with css attribute set to pointer. I have noticed that if the cursor keep changing when the user is scrolling, the scroll is not as smooth as when the cursor is unchanged. I have tried

$(window).scroll(function(){
        console.log('scrolling');
        $('body').css("cursor", "initial");

    });

but it seems it doesn't work, and other children's css attribute has overwritten the line, I didn't found any similar questions on Stack overflow, can someone point me to the right direction?

Not exactly sure what you are asking here, but maybe `pointer-events` can help you achieve what you want? http://www.thecssninja.com/css/pointer-events-60fps — CBroe, Jun 27 '15 at 13:16
let's say a div becomes cursor when is hovered, but when the user is scrolling the scroll bar, I want to keep the cursor unchanged even the user's cursor is hovering that div — Kesong Xie, Jun 27 '15 at 13:20

score 1 · Accepted Answer · edited May 23 '17 at 12:14

Thanks to link provided by CBroe, disable cursor event when scrolling I have found that what I need is to add pointer-events: none; to the body when the user is scrolling and remove it when the user stop scrolling.

first we need to add a class called disable-hover to our css file

.disable-hover {
  pointer-events: none;
}

second we need to detect whether the user is scrolling and add or remove the class correspondingly

$(window).scroll(function(){
        $('body').addClass('disable-hover');

    });


    $(window).scrollStopped(function(){
        $('body').removeClass('disable-hover');
    });

that's it!

scrollStoppped plugin is contributed by Jason to detect the scrolling has stopped

detect scroll stop

Stop cursor from changing on a cursor div when the user scrolling the document jquery

1 Answers1