Sign in to follow this  
Daria K

Mouse cursor png

Recommended Posts

Hello, I have this weird problem, I am trying to add a specific cursor png for my game. I couldn't find any solutions on how to do it with phaser, so I did it with css for the specific div, but somehow it works for the first three seconds, but when I hover a button in the game the png disappears, on reload it shows up again, and when I hover a button it disappears again? Is there a way to do this with phaser? Am I missing something?

Thanks!

Share this post


Link to post
Share on other sites

Use code:

//------------------------ Изменение курсора при ховере ----------------------//
function hover(element){
	// Курсор меняем только для десктопа
	if (Phaser.Device.desktop) {
		element.events.onInputOver.add(function() { this.game.canvas.style.cursor = "url('images/cursors/hand.png'), pointer"; }, this);
		element.events.onInputOut.add(function() { this.game.canvas.style.cursor = "url('images/cursors/arrow.png'), default"; }, this);
	}
};
//----------------------------------------------------------------------------//

//---------------------- Сброс ховер-эффекта ---------------------------------//
function hoverReset(){
	if (Phaser.Device.desktop) this.game.canvas.style.cursor = "url('images/cursors/arrow.png'), default";
};
//----------------------------------------------------------------------------//

 

Share this post


Link to post
Share on other sites

If you use Element.requestPointerLock, the mouse is hidden by default. Then you can listen to the mousemove event and use the e.movementX and e.movementY events to manually move whatever sprite you want to represent the mouse. The added benefit is now the user's cursor can't accidentally move outside your game's canvas. Though, depending on the type of game, this may not be desirable.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.