jQuery在文本輸入更改後移動div

我試圖將兩個單獨的文本字段輸入的輸入更改後，將圖像保持器div移動到特定的x和y座標。以下是x座標的代碼。jQuery在文本輸入更改後移動div

這裏是一個jfiddle here

var img1x; 
var img1y; 
var img1position; 

img1position = $("#img1").position(); 
img1x = img1position.left; 
img1y = img1position.top;

我已經試過這樣做，它只有在開關輸入值爲「0」移動DIV。它不會移動別的東西：

$("#img1x").change(function() { 
    //alert("img1x: " +img1x); 
    $("#img1").css('left', $("#img1x").val()); 
});

我試過這個，它什麼也沒做。

$("#img1x").change(function() { 
    img1x = $("#img1x").val(); 
    //alert("img1x: " +img1x); 
    $("#img1").css('left', img1x); 
});

來源

2013-01-11 Livi17

安德魯是正確的，你可以嘗試使用http://api.jquery.com/animate/爲一種流動的過渡，那麼你就不需要了'px'到底 – kidwon

嘗試增加'px'：

$("#img1x").change(function() { 
    img1x = $("#img1x").val(); 
    alert("img1x: " +img1x); 
    $("#img1").css('left', img1x + "px"); 
});

工作對我來說：http://jsfiddle.net/VNqqx/

原因0作品是因爲left: 0是有效的CSS。

來源

2013-01-11 22:40:19 Flash

權當然，我忘了「px」！謝謝！感冒藥正在戲弄我。 – Livi17

嘗試增加 '像素' 或* 1獲得一個int：

$("#img1").css('left', img1x + 'px');

看到http://jsfiddle.net/dhpkW/1/

來源

2013-01-11 22:41:31

添加「PX」你的左邊值：

$("#img1").css('left', img1x+'px');

來源

2013-01-11 22:42:03 joeltine

你可以嘗試用於流體轉換

$("#img1x").change(function() { 
    img1x = $("#img1x").val(); 
    alert("img1x: " + img1x); 
    $("#img1").animate({ 
     'left': img1x 
    }, 700); 
});

然後你不需要px。

檢查出來http://jsfiddle.net/dhpkW/6/

來源

2013-01-11 22:45:37 kidwon

jQuery在文本輸入更改後移動div

回答

相關問題