在jquery中添加一個變量Number到div的位置？

我得到了以下代碼來處理.animate，但它不會與標準的CSS屬性，任何人都可以告訴我爲什麼？在jquery中添加一個變量Number到div的位置？

var xMove = 200; 
$("#clickhere").click(function() { 
$("#object").css({left: '+='+xMove}); 
});

現在有幾個類似的工作方法和了解了一些關於沿途語法，良好示人，鉭！

來源

2010-08-20 jack

嘿看到這個http://www.jsfiddle.net/cM5Qe/ – 2010-08-20 07:51:18

您不能使用+=操作在常規的CSS。獲取當前位置並從中計算新的位置：

var xMove = 200; 
$("#clickhere").click(function() { 
    $("#object").css({ left: ($('#object').position().left + xMove) + 'px' }); 
});

來源

2010-08-20 07:39:33 Guffa

niceone，作品一種享受應該有這樣的想法，雖然 – jack 2010-08-20 08:22:17

嘗試

$(document).ready(function(){ 
    var xMove = 200; 
    var object = $('#object'); 
    $("#clickhere").click(function() { 
     object.animate({ 
      left: (object.position().left + xMove) + 'px' 
     }); 
    }); 
});

記住#object需要有絕對或相對位置的CSS left屬性工作時。如果它的靜態，你可以嘗試使margin-left變爲動畫。

來源

2010-08-20 07:30:13

歡呼聲，工程，想知道是否有可能沒有使用動畫（解釋如下）。 – jack 2010-08-20 08:03:20

只是改變object.animate（{to object.css（{ – 2010-08-20 08:19:18

是啊工作，當我看到其他答覆。尊敬！ – jack 2010-08-20 08:24:34

添加CSS屬性position，並將其設置爲relative;它會工作。我還刪除了+=，因爲它不屬於那裏：如果您想要移動object通過xMove你點擊它每次都定義爲右像素數

var xMove = 200; 
$("#clickhere").click(function() { 
    $("#object").css({position: "relative",left: xMove}); 
});

，您可以使用下面的代碼片段：

var xMove = 200; 
$("#clickhere").click(function() { 
    var obj = $("#object"); 
    var currentPosition = obj.position().left; 
    obj.css({position: "relative",left: currentPosition + xMove}); 
});

來源

2010-08-20 07:33:21

歡呼聲，看起來像guffas和橡皮刮板的代碼喜歡這個結構雖然，容易我按照 – jack 2010-08-20 08:21:27

試試這個，應該工作，

var leftpos = $("#object").css("left"); // get the current left position 
var left = parseFloat(leftpos , 10); 
left += 200; 
var toShift = left + "px"; 
$("#object").css("left", toShift);

來源

2010-08-20 07:38:07

沒有爲我工作，但努力 – jack 2010-08-20 08:22:36

2件事。首先，除非你設置了不同的position類型，否則left在CSS中什麼也不做。所以請確保#object有position:relative（或絕對的或固定的）。

其次，你不能在像這樣的值字符串中使用+=。您必須獲取值才能添加您的價值，然後將其設置爲執行此操作。

結帳這個工作示例：http://jsfiddle.net/d9LnJ/4/

不過說真的，爲什麼不使用.animate？

來源

2010-08-20 07:40:05

，但仍然學習語法規則感謝確實是我正在尋找。我想避免動畫，因爲我打算通過動態改變var xMove和循環遍歷函數來爲#object添加'velocity'。使用.animate作品，但是在應用時不太流暢。 – jack 2010-08-20 08:10:59

回答

相關問題