預加載圖像，仍然閃爍

我有大約30-40圖像，我目前正在嘗試重新加載。但是，當我將鼠標懸停在圖像上時，仍然會出現「閃爍」。圖像消失了幾毫秒後又回來了。預加載圖像，仍然閃爍

 var images = new Array() 
     function preload() { 
      for (i = 0; i < preload.arguments.length; i++) { 
       images[i] = new Image(); 
       images[i].src = preload.arguments[i]; 
      } 
     } 
     preload(
      "/../../regular.png", 
      "/../../hover.png" 
     );

這是我目前使用的功能，是上面的代碼有問題還是可能是另一個問題？

來源

2013-12-21 Cheese Puffs

您的函數有一個錯誤：您需要直接訪問參數對象，而不是該函數的屬性。試着這樣說：

 function preload() { 
      for (i = 0; i < arguments.length; i++) { 
       images[i] = new Image(); 
       images[i].src = arguments[i]; 
      } 
     }

據MDN，語法您目前正在使用（preload.arguments）已被棄用，不會在所有的瀏覽器。

（如果你檢查瀏覽器的JS控制檯你會看到一個錯誤報告，而且由於錯誤的循環就不會這樣運行的圖像不會預裝。）

來源

2013-12-21 11:40:39 nnnnnn

首先，我也這麼認爲，但它實際上可以作爲命名函數的屬性訪問參數，雖然我從來沒有見過它：http://jsfiddle.net/fP4Rs/ – David

nnnnnn - 謝謝你的迴應。不知道我會如何做到這一點，如果我按照自己的方式，我應該把我的所有圖像放在哪裏？再次感謝。 –

@David - 我從來沒有見過或使用它，但在看到您的評論後，我在[MDN]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/ Global_Objects/Function/arguments） - 顯然它被棄用，並且不被所有瀏覽器支持。（抱歉，我無法檢查您的演示，因爲jsfiddle在我手機的瀏覽器上不起作用。） – nnnnnn

我不知道你能避免在預加載圖像時懸停閃爍。我猜瀏覽器仍然需要從磁盤加載它們，這就是導致延遲幾毫秒的原因。

更好的方法是使用CSS精靈。請參閱this page，在下圖像精靈 - 懸停效果您會發現使用精靈進行懸停效果的示例。

來源

2013-12-21 11:42:09 Alex

預加載圖像，仍然閃爍

回答

相關問題