Custom Curser bugs

Site URL: https://www.korenshadmi.com/

Hello

I have made a custom curser (pink curser on hover) and the same one in black for normal scrolling.

Although most of the time it works perfectly well on Safari Browser on Chrome there are usually the following bugs:

The curser shortly appears as a magnifying glass (for a millisecond) or that the hover function doesn’t work sometimes and the curser stays black.  

Here is the code that I used (CSS):

body {
margin: 0;
height: 100vh;
cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/6195788ed4d7cb6f0a0b331e/1637185678241/normal.png), auto;
}

 a:hover{
   cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/61957853363c352f320a07cb/1637185619935/pink.png), auto;}

Here is the Website.

Thank you!

34 minutes ago, Koren said:

Hello

I have made a custom curser (pink curser on hover) and the same one in black for normal scrolling.

Although most of the time it works perfectly well on Safari Browser on Chrome there are usually the following bugs:

The curser shortly appears as a magnifying glass (for a millisecond) or that the hover function doesn’t work sometimes and the curser stays black.  

Here is the code that I used (CSS):

body {
margin: 0;
height: 100vh;
cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/6195788ed4d7cb6f0a0b331e/1637185678241/normal.png), auto;
}

 a:hover{
   cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/61957853363c352f320a07cb/1637185619935/pink.png), auto;}

Here is the Website.

Thank you!

Hey @Koren try to add next code in custom CSS:

.gallery-masonry-lightbox-link {
  cursor: none;
}

and remove ":hover" after "a" tag"

a {
   cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/61957853363c352f320a07cb/1637185619935/pink.png), auto;
}

Let me know if it work!

Hey @SquareRefresh Thank you ! But it seems to take away the cursor when I hover over the pictures.

2 minutes ago, Koren said:

Hey @SquareRefresh Thank you ! But it seems to take away the cursor when I hover over the pictures.

Replace:

a {
   cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/61957853363c352f320a07cb/1637185619935/pink.png), auto;
}

To:

a {
   cursor: url(https://static1.squarespace.com/static/6177faa906333b0e6c0f5f76/t/61957853363c352f320a07cb/1637185619935/pink.png), auto !important;
}

@SquareRefresh It worked!

Thank you!!!

1 minute ago, Koren said:

@SquareRefresh It worked!

Thank you!!!

You're welcome!

@SquareRefresh I still have one question left:

In the gallery preview, when I hover over the arrows I still have a hand instead a pink arrow. can I fix it somehow ?

I attached a picture for explanation

Thank you!

Hey @SquareRefresh

First of all: Thank you so much for the help!

It seems to work really with the arrows but again to pointer disappears when hovering on the pictures in the gallery

Thank you! 

1 hour ago, Koren said:

Hey @SquareRefresh

First of all: Thank you so much for the help!

It seems to work really with the arrows but again to pointer disappears when hovering on the pictures in the gallery

Thank you! 

oh, yeah sorry, just add !important after "auto". I just edit my code.

@SquareRefresh Thank you! works great

@SquareRefresh Hello again

There is a small problem left

on Safari while clicking there's a small bug where the default curser appears for a millisecond (you can see it in the video) 

Thank you!

Can anybody solve this?