HTML5畫布將背景圖像褪色到另一個圖像並返回

我想要來回褪色背景圖像，以使其顯示爲圖像發光。我使用的代碼淡化了圖像，但它導致第一個背景在顯示下一個背景圖像之前完全消失，我試圖使其淡入淡出，而不會在短時間內使背景變爲空白。HTML5畫布將背景圖像褪色到另一個圖像並返回

var currentPlay = 0; 
var playImages = []; 
playImages[0] = 'images/home/noglow.png'; 
playImages[1] = 'images/home/glow.png'; 

function changeImage() { 

    currentPlay++; 
    if (currentPlay > 1) currentPlay = 0; 

    $('#theImageToGlow').fadeOut(500, function() { 
     $('#theImageToGlow').css({ 
      'background-image': "url('" + playImages[currentPlay] + "')" 
     }); 

    }); 
    $('#theImageToGlow').fadeIn(500); 
    setTimeout(changeImage, 500); 
} 

<canvas id="theImageToGlow" ></canvas>

來源

2012-01-19 SeanStick

嗯奇怪......沒有畫布，你不顯示如何調用changeImage（），你不顯示swapPlayImages（）函數......並且你沒有解釋_exactly_你想要什麼。 ..現在你希望有人能夠幫助嗎？ – devnull69

對不起，我錯過了原帖的一些東西。我希望現在更容易理解。祝你今天愉快。 – SeanStick

fadeOut（）將始終消失爲0不透明度。您應該使用.fadeTo（），並將適當的目標opactiy設置爲參數。

來源

2012-01-20 07:53:36 devnull69

感謝您的幫助！ – SeanStick

HTML5畫布將背景圖像褪色到另一個圖像並返回

回答

相關問題