Cursor not working on scroll bar or gallery buttons

[Edrol97]

Hi all,

Wondering how I can solve this. I want a custom cursor on both scrollbar and gallery buttons. I attach the code:

body::-webkit-scrollbar {
    width: 1em round;
    overflow: scroll;
    cursor: url("img/background/cursors/pointer1.png"), pointer !important;
  }
 
  body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px #1e4cad;
  }
 
  body::-webkit-scrollbar-thumb {
    background-color: #1e4cad;
    outline: 1px solid #1e4cad;
    border-radius: 10px;
  }
  body::-webkit-scrollbar-thumb:hover{
    cursor: url("img/background/cursors/pointer1.png"), pointer !important;
  }

.previous_button,
.next_button,
.close_button {
    font-family: Arial, Helvetica, sans-serif;
    font-size: large;
    align-items: center;
    font-size: xx-large;
    position: absolute;
    color: white;
}
.previous_button,
.next_button,
.close_button:hover{
    cursor: url("img/background/cursors/pointer1.png"), pointer;}

Thanks,

El

 

[Johna]

I'm not sure it's possible to apply a custom cursor to the scrollbar only. You could try putting an element behind it and giving that element a custom cursor, but I can't guarantee that'll work.

 

[Edrol97]

I'm not sure it's possible to apply a custom cursor to the scrollbar only. You could try putting an element behind it and giving that element a custom cursor, but I can't guarantee that'll work.

It didn't work. Just acted as it did before.

 

[Johna]

Yeah, it's probably not possible.

 

[Edrol97]

Yeah, it's probably not possible.

The thing is I've managed to do it previously in css, so I can't understand why it's not working this time. I'm doing this at the moment:

.previous_button,
.next_button,
.close_button:hover{
cursor: url("img/background/cursors/pointer1.png")};

and I'm not sure what's wrong with it

 

[tomliv]

Are we talking about cursors on hover of buttons or scrollbars?

 

[tomliv]

The thing is I've managed to do it previously in css, so I can't understand why it's not working this time. I'm doing this at the moment:

.previous_button,
.next_button,
.close_button:hover{
cursor: url("img/background/cursors/pointer1.png")};

and I'm not sure what's wrong with it

Does this work with a fallback in place?

 

[Edrol97]

Does this work with a fallback in place?

No

 

[Edrol97]

Are we talking about cursors on hover of buttons or scrollbars

It's hover on my own buttons with an onclick() function. It looks like this, with each button housed in its own div.

<div class="next_button" onclick="NextImage()"><img src="img/background/right-arrow.png"></div>
               <div class="previous_button" onclick="PreviousImage()"><img src="img/background/left-arrow.png"></div>
               <div class="close_button" onclick="CloseLightbox(1)"><img src="img/background/close-button.png"></div>