這個腳本爲什麼不能作爲淡出動畫效果工作

這將是一個JavaScript函數;使用onclick事件處理程序或其他東西。然後onclick它會淡出什麼東西的框ID是使用document.getElementsById（）對象，爲什麼它不會淡出？就像我見過的很多效果一樣？另外請注意，我試圖用jQuery或任何插件來做到這一點，因爲我試圖學習和掌握JavaScript。這個腳本爲什麼不能作爲淡出動畫效果工作

setTimeout(function() { 
     for(var i = 1; i< 9; i++) { 
      setTimeout(function() { 
      box.style.opacity = '0.'+i; 
      }, 100); 
     } 
     }, 1000);

來源

2011-05-09 Aaron

可以提供更多的細節，以瀏覽器的版本和代理？ – Neeraj 2011-05-09 13:46:29

我正在使用Firefox 4.0 – Aaron 2011-05-09 13:47:04

[Javascript：關閉循環？]（http://stackoverflow.com/questions/5555464/javascript-closure-of-loop）和[許多其他]（http：// stackoverflow .com/search？q = closed + in + loop +％5Bjavascript％5D） – 2011-05-09 13:55:07

你應該遞歸調用該函數，就像這樣：

var box = document.getElementById('box'); 
    var i = 10; 
    function fadeOut() { 
     if (i>0) { 
      i--; 
      box.style.opacity = '0.'+i; 
      setTimeout(fadeOut, 100); 
     } 
    } 
    setTimeout(fadeOut, 1000);

來源

2011-05-09 13:51:48 Matic

的作品正是我想要的，你可以請進入的一切是如何工作的，因爲我希望能夠了解究竟怎麼回事 – Aaron 2011-05-09 13:58:26

你安排幾乎在同一時間所有超時（在環路）更詳細，所以他們都幾乎在同一時間觸發。我在這裏改變的是，首先'我'被設置爲10，然後'fadeOut'被調用並減少i（改變爲9），因此不透明度現在被設置爲0.9，之後它在100ms內安排下一次更新（'setTimeout（fadeOut，100）'）並且重複相同的功能，直到'i'爲0（並且不透明度爲0.0）。檢查維基百科上的遞歸：http://en.wikipedia.org/wiki/Recursion – Matic 2011-05-09 14:05:57

有幾件事情：

1）你實際上是通過提高透明度，而不是通過降低不透明度淡出它的衰落在框中。

2）您正在同時設置所有setTimeout函數，在內部調用中您可能需要調用setInterval並使該增量爲i。或者，您可以通過將時間設置爲100 * i而不是僅僅設置100來累積setTimeouts。

來源

2011-05-09 13:48:39 ADW

+1，我太在意9歲了，但這也是一個很好的答案，因爲即使在修復之後，你的淡入也會等待100秒然後所有的超時將被調用。可能不是他要找的東西。 – Robert 2011-05-09 13:54:34

這個問題在您的問題中不太清楚，但可能會立即在0.9不透明度下看到它。原因在於for循環實際上並沒有給你循環中的i的值，而只是在其中訪問它的地址。如果你真的在for循環體內使用它，那很好，但是你沒有那樣做。當你設置超時時，在超時被調用的時候，它已經完成迭代循環，我是9.因此，每個超時只是將不透明度設置爲0.9。

要解決這個問題，你可以把它包裝在一個自動執行的匿名函數中，它傳入i的值。這樣做會導致匿名函數對範圍i進行限制，並允許它在被調用時被超時訪問。

setTimeout(function() { 
    for (var i = 1; i < 9; i++) (function(i) { 
     setTimeout(function() { 
      box.style.opacity = '0.' + i; 
     }, 100); 
    }(i) // (i) at the end automatically executes, with the argument of i 
}, 1000);

來源

2011-05-09 13:49:01 Robert

這個腳本爲什麼不能作爲淡出動畫效果工作

回答

相關問題