Spritesheet Click Through

1

Hello.

I am looking for a method to make spritesheet animations click through so buttons/elements can be interacted with underneath it.

2

You can enable “ignore clicks” on the layer in Hype.

If you need another way you can define a CSS class in head html that contains the pointer-events directive set to none.

3

I’ve already tried this with spritesheets and it doesn’t appear to work. I know I’m doing it right because I tried it with just a regular picture and rectangle and they both worked. If you get it to work please let me know.

4

This should be fixed in an updated @jonathan (allowing to ignore clicks on sprites).

Quick fix: you need the !important keyword to override the style Hype forces onto the element itself. Also as the sprite creates a nested div setup you need to force it onto the children.

	<style>
		.noclicks, .noclicks * {
			pointer-events:  none !important;
		}
	</style>

If you want to avoid the star selector you can also just target HYPE_element

	<style>
		.noclicks, .noclicks .HYPE_element {
			pointer-events:  none !important;
		}
	</style>

You only need on of these definitions.

Assign noclicks to your sprite sheet as a class.

2 Likes
5

That did the trick. Thank you.

1 Like
6

Good find/call, this is on the list to fix. Thank you.

1 Like