我不工作

我的HTML簡單的動畫功能是：我不工作

<html> 
    <body> 
     <button id="widthPlus">increase </button> 
     <div id="bod"> hai </div> 
     <img id="tree" src="http://www.rangde.org/newsletter/nov11/images/real_tree.png" width="350"/> 
    </body> 
</html>

我的腳本是：

$(document).ready(function() { 
    $("#widthPlus").click(function(){ 
     var currentwidth = $('#tree').attr('width'); 
     var currentwidthNum = parseFloat(currentwidth, 350); 
     var newwidth = currentwidthNum+5; 
     $('#tree').animate({'width', newwidth}, 5000); 
     return false; 
    }); 
});

我試圖增加（5像素）圖像寬度點擊一個按鈕my jsfiddle is here

來源

2011-12-15 Suresh Pattu

你是怎麼想出`parseFloat（）`的第二個參數的？另外，您需要使用jQuery的`.width（）`來可靠地獲取實際的寬度。 – jfriend00 2011-12-15 05:52:43

好吧，我嘗試謝謝你:) – 2011-12-15 06:13:02

時

$(document).ready(function() { 
    $("#widthPlus").click(function() { 

     $('#tree').animate({ 
      'width': '+=5' 
     }, 5000); 
     return false; 
    }); 
});

jsFiddle。

來源

2011-12-15 05:48:36 alex

您有許多語法錯誤，也沒有正確使用某些功能。我強烈建議使用parseFloat和jQuery animate等文檔。使用Chrome的檢測工具或Firefox的螢火蟲，您將能夠看到正在發生的明顯的JavaScript錯誤，並且能夠進行調試。

這裏是你的代碼工作（這樣你可以學到）的修改版本：http://jsfiddle.net/XjaD5/5/

$(document).ready(function() { 
    $("#widthPlus").click(function(){ 
     var currentwidth = $('#tree').width(); 

     var newwidth = currentwidth+5; 
     $('#tree').animate({'width': newwidth}, 5000); 
     return false; 
    }); 
    });

Alex的版本是一個更好的和優雅的解決方案，但是。

來源

2011-12-15 05:54:22 Vigrond

回答

相關問題