使用jQuery拖動的固定鼠標指針

Question

我正在用HTML5構建一個小遊戲。畫布元素是進入遊戲世界的視口。用戶可以通過點擊鼠標並拖動一個小圖標來移動視口在世界上的位置。

問題是，當鼠標指針碰到屏幕邊緣時，滾動停止。很可能，這會嚴重限制滾動方向之一，因爲圖標將位於頁面的某個角落。

我能想到的唯一技術解決方案是以某種方式修復鼠標指針在圖標上的位置並檢測每個框架的相對移動。基本上，我會在每次拖動事件後將指針位置重置回圖標的中心。不幸的是，我相當肯定這是不可能的。從可用性和安全角度來看，玩用戶指針是一個很大的難題。

那麼，有沒有其他的方式來做我想要的？我主要在這裏尋找技術想法，但對更合適的界面的建議也是受歡迎的。

Answer 1

三種可能的解決方案：

1. 移動這個 「搖桿」 圖標100個像素角落落的。給它不透明度，直到它被徘徊。點擊並拖動移動「延續」，以便點擊並拖動並保持距操縱桿中心40個像素的光標會導致連續的屏幕平移。

2. 使用箭頭，類似於Google Maps。 （您也可以通過將手持部件更改爲「操縱桿」部件將其與第一種解決方案結合使用。）

3. 做一些完全不同的事情。例如，當光標接近四個邊中的任何一個時，讓屏幕平移。