Scratch Top Image Using Custom Cursor

Using JavaScript with Hype Function Library
1

Hi!
I’m working on a project that uses the scratch.js for erasing the top image to view the bottom.
What I need for this project to do is have a custom cursor to erase the top image.
I included the code,

“coin":"${resourcesFolderName}/ZamboniCursor.png

in the ScratchPad function.
It works like it should in Safari on the desktop. It’s so cool!

The erase feature works on the iPad but the custom cursor does not display.
Is there a way for the custom cursor to display on the iPad as well as erase the top image?

I’ve included the project file.
indexMR.zip (2.4 MB)

I appreciate any help I can get.
Thanks so much!
Marian

2

For what it’s worth, it doesn’t work at all on Chrome.

1 Like
3

Mobile browsers don’t support custom cursors since they have no cursors. You would probably need to have an actual element that is set to move with touches on touch start, adjust it on touchmove, and then hide it on touchend via javascript code.

2 Likes
4

Thank you Jonathan. Would I be able to modify the code being used now or is there javascript I can find on the internet to make this work?
I tried modifying the javascript I have but I wasn’t successful.
Help is greatly appreciated!
Marian

indexMR-2.zip (2.3 MB)

5

Thanks for checking Nathan!
I thought since it works in Safari, that it would work in Chrome.
I noticed it doesn’t work on Firefox either.
Much appreciated!!
Marian

6

I’m not familiar with the scratch.min.js you are using. You may want to contact the authors; it seems like having this work on mobile would be a common improvement they would want to make.