I'm having trouble with a game board on my webpage. The board is 20x20 squares, but the container can only fit 10x10. I want to make the game board draggable so that the user can move it within the limits of the container. I tried using jQuery UI's draggable element, but I can only set constraints related to the container itself. I managed to set bounds for the drag, but it was slow and didn't work well with scrolling.
I'm not happy with scrollable solutions either, as the scrollbars end up inside the content and look messy. Is there a draggable solution with inertial scroll? Or is scrolling the only option? Do I have to choose between one or the other?
Any advice would be appreciated! Thank you.