微信小程序实现图片淡入淡出

要实现图片的淡入淡出效果，可以通过css的opacity属性来控制。具体实现步骤如下：

1. 在wxml文件中，创建一个image标签，并设置两张图片路径，如下：

<image class="fade" src="{{imageUrl1}}"></image>
<image class="fade" src="{{imageUrl2}}"></image>

2. 在wxss文件中添加以下样式：

.fade {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

其中，opacity属性设置为0，表示图片开始时隐藏，transition属性设置为1s，表示过渡时间为1秒，ease-in-out表示过渡效果为渐进渐出。

3. 在js文件的onLoad函数中，设置定时器，用来控制图片的淡入淡出效果：

onLoad: function(options) {
  setInterval(() => {
    this.setData({
      hasShowFirstImage: !this.data.hasShowFirstImage
    });
  }, 2000);
}

其中，定时器每隔2秒执行一次，将hasShowFirstImage属性取反，用来控制两张图片的显示隐藏。

4. 在js文件的setData函数中，根据hasShowFirstImage的值，改变两张图片的透明度，实现淡入淡出：

setData({
  hasShowFirstImage: !this.data.hasShowFirstImage,
  imageUrl1: this.data.hasShowFirstImage ? img2 : img1,
  imageUrl2: this.data.hasShowFirstImage ? img1 : img2,
});

这里使用了三目运算符来判断当前应该显示哪一张图片，然后将另一张图片的opacity属性设置为0，当前显示的图片的opacity属性设置为1，实现淡入淡出效果。

最终效果为图片每隔两秒自动淡入淡出一次。