Home/ Questions/Q 7937575
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T22:33:20+00:00

I have an overflow: hidden div which I am scrolling by allowing the user

  • 0

I have an overflow: hidden div which I am scrolling by allowing the user to click and drag the background. There are also links and buttons in this space.

This is what I do for the CSS: 

#div-grabscroll {    
    cursor: url(../img/openhand.cur), move;
}
#div-grabscroll:active {
   cursor: url(../img/closedhand.cur), n-resize;
}

This works great but what happens is that while dragging, if the mouse ends up moving (due to reaching scroll limits) over a button the pointer cursor overrides my closedhand cursor.

The desired behavior is that for the entire duration that the div is being controlled by the mouse, I want the cursor to remain the closedhand.

Is there a way to override the cursor without modifying CSS for everything that the mouse might move over? I tried !important on the :active style but that didn’t do it.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Answer / Question: What would happen if you had a duplicate div which sat on top of the grabscroll div, but which had no background or content of any type so as to not hide anything behind it, and then set the cursor hand on this.

    Does z-index overwrite importance this way?

    Does this make sense?

    Effectively you have grabscroll – button – opaque grabscroll in that layered order.

    • 0