javascript - fade in images with javascript

Question

Without using jquery, is it possible to simultaneously fadein and replace another image?

I've created a map with intricate polygonal areas that onmouseover and onmouseout, replaces imageA with imageB as seen in the following function. However, the transition is too abrupt upon replacing the image. It would be awesome if I can simply add a couple lines of code below the "if (aa==0) {...}" to do this. Unfortunately, my rudimentary knowledge of javascript prevents me from doing so.

aa=0;
function replaceImage()
{
if (aa==0) 
  {
  aa=1;
  document.getElementById('imageA').src="img/imageB.png";
  }
else
  {
  aa=0;
  document.getElementById('imageA').src="img/imageA.png";
  }
}

Thanks so much!

Answer 1

是的，您可以使用循环播放并调整图像的不透明度以淡入和淡出。如果您愿意使用 css3，您可能想查看此链接。http://css3.bradshawenterprises.com/cfimg/