Envision, Create, Share

Welcome to HBGames, a leading amateur game development forum and Discord server. All are welcome, and amongst our ranks you will find experts in their field from all aspects of video game design and development.

[MV] Custom cursors not working in browsers

I am using a plugin, which works in game, but not when played in a browser.

The plugin: http://mvplugins.tordamian.com/plugins/mouse-system-ex/

But that is not important as the line in question is this:

.container {
cursor: url("../img/cursors/default.png") 0 0, default;
}

Firefox, Edge and Chrome all fail to perform this CSS rule. Firefox states:

"Invalid property value".

1gHSikH.png


A google shows multiple people getting this error not in RPG Maker but in web browsers in general, but after reading dozens of them I cannot find a single answer, nobody seems to know what is going on.

As I say it works completely fine when playing the RPG maker game as a standalone.
 
Solution
Have you verified that the path is correct and that your server has read access of that path? Could be your root directory on the web deployment is different to the offline deployment.
See if you can access "../img/cursors/default.png" from the browser. Better yet, check if it's loading in the browser sources in developer tools.

Strangely, if a CSS url fails it should cascade and use the comma, the invalid property value suggests that "default" is not working for you - unless browsers report failed cascades? Perhaps rename "default" to "auto"?

I've also read that CSS cursors will fail for large images (anything above 32px) on some browsers; try using GIF format and 24px sized custom cursor.
Have you verified that the path is correct and that your server has read access of that path? Could be your root directory on the web deployment is different to the offline deployment.
See if you can access "../img/cursors/default.png" from the browser. Better yet, check if it's loading in the browser sources in developer tools.

Strangely, if a CSS url fails it should cascade and use the comma, the invalid property value suggests that "default" is not working for you - unless browsers report failed cascades? Perhaps rename "default" to "auto"?

I've also read that CSS cursors will fail for large images (anything above 32px) on some browsers; try using GIF format and 24px sized custom cursor.
 
Solution

Thank you for viewing

HBGames is a leading amateur video game development forum and Discord server open to all ability levels. Feel free to have a nosey around!

Discord

Join our growing and active Discord server to discuss all aspects of game making in a relaxed environment. Join Us

Content

  • Our Games
  • Games in Development
  • Emoji by Twemoji.
    Top