kittykatattack / hexi

Make games the fun way!
MIT License
551 stars 83 forks source link

HTML "range" input slider sticking to mouse when used in same DOM as hexi #45

Closed ddoubleprime closed 6 years ago

ddoubleprime commented 6 years ago

Hi,

Thanks for Hexi; it's slick.

But I'm having trouble with a little game that adjusts to inputs from a "range" slider in a div in the same HTML body as the Hexi game. The game reads and responds to the slider values no problem, but the slider doesn't function correctly.

In firefox: If I drag a slider it works, but as soon as the mouse is moved away from the slider, the slider jumps back to its initial value.

In chrome/safari: if i drag the slider it becomes stuck to the mouse, even if I let go of the mouse button. I can no longer click any other element (no buttons or anything). I have to reload the page to release the slider knob.

It sounds very similar to this issue that was reported here for use in Phaser a couple years ago: http://www.html5gamedevs.com/topic/12657-html5-range-input-slider-focus-issue/

in fact, so similar I copy-pasted some of the problem description text from that report.

Perhaps though I am doing something wrong?

thanks

kittykatattack commented 6 years ago

Hi!

Did you grab the latest build? I've fixed it in that. I had exactly the same problem but now it's working fine. It was caused by preventDefault on a mouseup event on the window object with the Tink interactive module.

ddoubleprime commented 6 years ago

Ah, that did the trick! It wasn't too long ago that I'd downloaded it so I didn't think to check for a newer build. Thanks again.