jQuery改變圖像位置

我是jQuery的新手，我需要你的幫助。jQuery改變圖像位置

我想要建立一個表有2列標記爲X和Y，每列中的輸入字段和更改按鈕，當用戶單擊按鈕時，jQuery函數將檢查字段是否爲空，如果它們是函數會將默認值放在jquery頭文件中定義的偏移量（{left：x，top：y}）中，如果這些字段不爲空，它將從字段中取值並更改圖像的位置。

因此，每次用戶更改字段的值時，圖像的位置都會改變。

Thanx提前，

來源

2012-01-31 Ya Basha

這裏有一個JS撥弄着一個工作版本：http://jsfiddle.net/UKRD8/14/

只要確保你把「PX」您輸入的輸入數量後。

來源

2012-01-31 14:11:05 Tim

<div style="position:relative; width:100%; height:100%;"> 
    <table cellpadding="0" cellspacing="0" style="position:relative; z-index:9;"> 
     <tr> 
      <td>X:</td> 
      <td> 
       <input id="txtX" type="text" /></td> 
     </tr> 
     <tr> 
      <td>Y:</td> 
      <td> 
       <input id="txtY" type="text" /></td> 
     </tr> 
     <tr> 
      <td colspan="2"> 
       <input id="btnUpdate" type="button" value="Update" onclick="updateCords()" /></td> 
     </tr> 
    </table> 

    <img id="img" src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley.svg/160px-Smiley.svg.png" style="position:absolute; z-index:1;" /> 
    </div> 

<script> 
    function updateCords() { 
     var x = $('#txtX').val(); 
     var y = $('#txtY').val(); 

     if (x === '') { x = 0 } 
     if (y === '') { y = 0 } 

     $('#img').css({ 'left': x + 'px', 'top': y + 'px' }); 
    } 
</script>

來源

2012-01-31 14:14:46 zgood

謝謝，但我想要三行，每行會改變一個圖像的位置，只是一個按鈕，謝謝你的幫助 – 2012-01-31 14:20:50

jQuery改變圖像位置

回答

相關問題