如何在各個方向移動元素？

我知道對象可以在X和Y方向上動畫的頁面上，但可以請你告訴我，如果有可能低於動畫像黃河方向的所有方向的事情：到目前爲止，我 enter image description here 如何在各個方向移動元素？

一個jquery代碼：

var position = $("#redBox").position(); 
    switch (e.keyCode) 
    { 
     case 37: 
     $("#redBox").css('left',position.left - 2 +'px'); 
     break; 
     case 38: 
     $("#redBox").css('top',position.top - 2 +'px'); 
     break; 
     case 39: 
     $("#redBox").css('left',position.left + 2 +'px'); 
     break; 
     case 40: 
     $("#redBox").css('top',position.top + 2 +'px'); 
     break; 
    }

正在移動中的X和Y的REDBOX但如何可以迫使它移動，即使在黃色系上推鍵（37 + 38）和（39 + 38）？

感謝

來源

2014-03-06 Behseini

你可以在這裏看看如何捕捉多個關鍵事件：http://stackoverflow.com/questions/5203407/javascript-multiple-keys-pressed-at-once – Mathias

感謝Mathias，但我不知道如何使用switch語句中的鍵！ – Behseini

如果你想向上移動+只剩一舉兩得。

$("#redBox").css({ 'left': position.left - 2 + 'px', 'top': position.top + 2 + 'px'});

或與動畫喜歡這裏：http://jsfiddle.net/jdWRT/

PS。

我偷的鏈接從這裏：How to move an element in Diagonal Movement in jQuery?

來源

2014-03-06 17:16:53

感謝bobek，但是我怎樣才能在這裏使用Keys？ – Behseini

只需跟蹤按下的按鍵。將它們添加到陣列並在需要時清理陣列。看看這裏：http：//stackoverflow.com/questions/5203407/javascript-multiple-keys-pressed-at-once –

好吧，這有點讓我感到困惑！那麼我怎麼能在switch語句中將Case 39和38放在一起呢？ – Behseini

當箭頭鍵被按下（onkeydown事件），你可以設置一個標誌爲關鍵。當該鍵被釋放（onkeyup）時，您可以取消該標誌。這樣您就可以知道每個鍵的狀態，並且您可以測試onkeydown處理程序（或其他任何地方）是否按下任意鍵組合。

在這一點上，你只需要做什麼bobek說，同時調整左側和頂部屬性。

來源

2014-03-06 17:27:50 user3389167

另外，如果您打算爲此設置動畫效果，我會建議使用純javascript而不是jQuery。雖然jQuery可以讓代碼非常快速，但是速度很慢，而且每當您開始每秒執行大量方法調用時，您都會注意到。 – user3389167

如何在各個方向移動元素？

回答

相關問題