讲一下大致思路吧，希望能帮到你
通常来说，元素id要求是唯一的，虽然不唯一也不会报错，但可能导致代码得不到你想要的效果。你在for循环里面定义了 id="blue2" 这是不合理的。
你不能在每个元素上统一设置 transform, 因为这样的话一变全都变了，区分不了。
for循环你能拿到索引 index，你可以根据index拿到当前展示的元素，那么 通过 index+1就能拿到下一个元素。注意，需要判断是否存在下一个元素
针对当前元素做缩小处理，下一个元素做放大处理。el.style.transform = 'scale()'
小程序的开发和原生js多多少少还是有些区别的，具体的情况需要你自己调试了。
用js实现图片点击时放大，再点击恢复的方法：1、页面定义区片区域：
<img src="Images/home.jpg" id="Img1" width="118" height="106" border="0">
<img src="Images/machine.jpg" id="Img2" width="118" height="106" border="0">
<img src="Images/title_Mixie.jpg" id="Img3" width="118" height="106" border="0">
2、定义js方法的mouseover和mouseout事件：
$(document).ready(function () {
$('#Img1, #Img2, #Img3').mouseover(function () {
$(this).animate({ width: "122px", height: "110px" }, 100)
})当鼠标放上去的时候，图片变大
$('#Img1, #Img2, #Img3').mouseout(function () {
$(this).animate({ width: "118px", height: "106px" }, 100)
})当鼠标离开的时候，图片还原为原来的尺寸
})
